2021 Call for Code Awards: Live from New York, with SNL’s Colin Jost! Learn more

IBM Developer Blog

Follow the latest happenings with IBM Developer and stay in the know.

A school project finds that IBM Cloud is a versatile and intuitive platform for nonprofits

Archived content

Archive date: 2020-10-26

This content is no longer being updated or maintained. The content is provided “as is.” Given the rapid evolution of technology, some content, steps, or illustrations may have changed.

As a high school student in Andrew-Chavanne at in Geneva, as part of my infomatics class, I wanted to a create a website for a non-governmental organization (NGO).

I found that IBM Cloud was a great way to start, and I came up with several tips for guiding NGOs and nonprofits. For an NGO, having a website means having visibility, to grow and help more people. However, creating a new website can be very challenging. Most small NGOs end up buying a template on the internet in order to save time and frustration. However NGOs might want to build their own websites, if they want to learn basic coding, if they want websites that truly represent their organizations, or if they can’t afford to spend money on a template.

Creating a website with IBM Cloud is a good option for NGOs because they can use a very versatile and intuitive platform for free. For my school project, I created for an NGO I had previously worked with.

Here are the steps that I give NGOs to code an entire website using IBM Code:

  1. Sign up an IBM Cloud account at www.ibm.com/cloud. NGOs and nonprofits need internet access and a common email address to use.

  2. On cloud.ibm.com, log in with your IBM Cloud account.

  3. After you are logged in, click the menu button at the top left, and select DevOps.

  4. On the left, click Toolchains.

  5. Then, on the top right, click Create a Toolchain.

  6. Select the first option: Develop a Cloud Foundry app.

  7. Under Toolchain Name, type a name that is the name of your website (for example, MyNGOwebsite if you are creating a website with MyNGOwebsite.com for a URL).

  8. Select your region. Important: Select the region that is nearest to you.

  9. Scroll down, and in the Tool Integrations section, select Git repos and tracking, and for the type of repository, select New.

  10. Click Create.

    Your website now exists, but you need to put it online.

  11. In the CODE column, click the Eclipse Orion Web IDE option.

  12. You work on the page that opens for the rest of your process. In the top left, under the name of your toolchain, under Root, click New and then click File.

  13. Create a file named index.html, and add HTML to it like the following example:

    <!DOCTYPE html>
    <html lang="en">
    <title> Your title </title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content=" Your name ">
    <meta name="description" content=" 155 characters what is on the page itself ">
    <link rel="stylesheet" href="style.css">
    <p>Welcome to your website</p>
  14. Click New > File and create a file called manifest.yml. Add code like the following example:

    - buildpack: https://github.com/cloudfoundry/staticfile-buildpack
    host: Your name
    name: The name of your website
    memory: 64M
    stack: cflinuxfs2
  15. Click New > File and create a file called style.css.

  16. Click the run icon in the top right of the page.

    Wait for the small button in the blue quadrant to turn green. Click the arrow icon, and your website should open. If you used the sample HTML in step 13, it reads: “Welcome to your website.”

    After they have created their websites on IBM Cloud, I point the NGOs who are new to web development to resources about HTML, CSS, JQuery and JavaScript, such as api.jquery.com.

I also provide NGOs with the following tips for their next steps:

  • The index.html file is your website’s welcome page. If you want to create a new page, click your toolchain name, then click New and File.
  • To add an image to your code, put the image file in your toolchain file. If you don’t complete this extra step, you won’t see your image.
  • Try to be coherent in your code. Use the same font-family and the same colors, not just for ease of coding, but to make your site visually pleasing.
  • Always have a contact form, or donation form visible on your web pages. Then it is easier for the viewers or users of your website to ask questions, or to donate to your organization.

Based on my hands-on experience, the advantages of IBM Cloud can be summarized in the following three points:

  • Using IBM Cloud, an NGO can deploy locally and scale globally, leveraging the 60 data centers on 6 continents (including Africa and South-East Asia). Other solutions are more regionalized and with presence only in Western countries. IBM Cloud can be the final place where the web solution lives.
  • Another important aspect is the functional scaling. Traditional solutions are just limited to pure web site hosting. With IBM Cloud, NGOs can shift gears and add capabilities in the domain of artificial intelligence and blockchain. Opportunities for NGOs are vast: imagine all the management of local country certifications and grants for activities and funding, and the related security aspects.
  • Finally, IBM Cloud is based on open source technology. Compared to other proprietary solutions, an NGO is not tied to a specific technology or delivery model. NGOs are free to implement the way they prefer.

I look forward to encouraging other nonprofits and NGOs in building their websites, helping the growth of their charity organizations. If you have any questions, you can contact me at elisabettamarchespam@gmail.com.