Hitting a dead-end is common when you're programming. It’s common with any type of problem-solving.

We get stuck on a particular way of seeing the problem and it can be difficult to achieve a new perspective.

I recently came across a tool from the creative arts and realised it could be adapted to work for programming.

The tool that inspired me is Oblique Strategy Cards. They are prompts to break a cycle of thinking and inspire us to think differently. Cards include ‘Remove specifics and convert to ambiguities’ and ‘Use an old idea’.

One of their most famous uses was on the David Bowie album Heroes. On the track ‘Sense of Doubt’, for example, Bowie and Brian Eno took turns doing overdubs based on Oblique Strategy Cards without revealing to the other what their card had said.

I think coding dead ends need something more direct. In moments of being stuck on a problem we both need inspiration and reassurance.

The Solution? The Coding Inspiration Machine

So I’ve collected quotes on the process of coding from experts – people who have created programming languages and operating systems. And I’ve put these wise words into a design by Gordana Minovska that gives the quotes centre stage.

https://ryandawsonuk.github.io/CodingInspirationMachine/

The aim is to have a tool to help get from “I can’t see any solution” to “maybe this approach will go somewhere” to “aha”.

We often get stuck in a perspective that doesn’t allow us to see the ‘maybe’ approaches. In those moments we could use some wise words from a master problem-solver to give us a jolt.

For example, these words from Robert C. Martin:

When you are working on a problem, you sometimes get so close to it that you can’t see all the options. You miss elegant solutions because the creative part of your mind is suppressed by the intensity of your focus.

The idea is to either bookmark the url or fork the repo and configure GitHub Pages to host your own version.

With a fork you can change the quotes to whatever you find most helpful. Then you can return to the Coding Inspiration Machine when you get stuck.

Of course this is just one inspiration tool. It won’t replace others like brainstorming and mind-maps.

David Bowie used many tools for inspiration and his music probably owes more to inspiration from newspaper clippings than Oblique Strategy Cards.

But the point with the Coding Inspiration Machine is to have an easy, go-to tool to remind us that it’s ok to get stuck, that it’s meant to be hard, and that there will be ways forward.

Real world applications for the Coding Inspiration Machine

Here are a few situations I’ve hit recently that got me thinking about this technique.

Getting creative

There was an authorization problem with a system I work on. The authorization code that was working with several authorization providers didn’t work for a particular Active Directory setup.

We didn’t know initially if it was a config problem on the provider side, config on the app side, a connectivity problem, or a problem in our code. We even built a custom test tool to narrow the problem down.

It eventually turned out that we needed an extra resource_uri parameter to be included in one of our http calls.

Finding a solution

For this same system we wanted to show metrics over long periods. This led to trying to make Prometheus queries over data ranges that are too big for Prometheus queries.

There’s a range of ways to handle this, from changing what we query for, to using different/more tools, to restructuring the data. We chose what amounts to restructuring the data.

Seeing the less obvious answer

My father-in-law showed me that his smart TV was not working with Netflix.

After navigating several confusing menus and trying various wireless networks, we found it to be a signal strength problem with the network that the TV was preferring (it worked fine with a network that the TV thought was lower strength).

Wrapping up

These problems are all different but they share common features.

Each required research and experimentation and eliminating possibilities. Each of them was initially surprising and it took time to adjust expectations and realise why the problem was there. It was necessary to explore multiple paths and each time that a path was unsuccessful it was disheartening.

It is easy to get stuck in these situations and find that we can’t see any paths anymore. The words of others who have been there before can help us see these situations with fresh eyes.

Have a look at the Coding Inspiration Machine and feel free to submit suggestions to the github repo or contact me on twitter.

Some of the social giants like Facebook even use this approach to give page loading a better experience. How can we do that with just some simple CSS?

• What are we going to build?
• Just want the snippet?
• Part 1: Creating our loading animation
• Part 2: Using our loading animation in a dynamic app

What are we going to build?

We're going to create a loading animation using a CSS class that you can apply to pretty much any element you want (within reason).

Loading animation preview

This gives you great flexibility to use it and makes the solution nice and simple with only CSS.

While the snippet is pretty small and you could just copy and paste it, I'll walk you through what's happening and an example of using it dynamically when loading data.

Just want the snippet?

You can grab it here!

Do I need to know how to animate before this tutorial?

No! We'll walk through in detail exactly what you need to do. In fact, the animation in this tutorial is relatively simple, so let's dig in!

Part 1: Creating our loading animation

This first part is going to focus on getting the loading animation together and seeing it on a static HTML website. The goal is to walk through actually creating the snippet. We'll only use HTML and CSS for this part.

Step 1: Creating some sample content

To get started, we'll want a little sample content. There's really no restrictions here, you can create this with basic HTML and CSS or you can add this to your Create React App!

For the walk through, I'm going to use HTML and CSS with a few examples of content that will allow us to see this in effect.

To get started, create a new HTML file. Inside that HTML file, fill it with some content that will give us the ability to play with our animation. I'm going to use fillerama which uses lines from my favorite TV show Futurama!

Static HTML & CSS webpage with content from fillerama.io

If you're going to follow along with me, here's what my project looks like:

my-css-loading-animation-static
- index.html
- main.css

Follow along with the commit!

Step 2: Starting with a foundation loading class

For our foundation, let's create a new CSS class. Inside our CSS file, let's add:

.loading {
  background: #eceff1;
}

With that class, let's add it to a few or all of our elements. I added it to a few paragraphs, headings, and lists.

<p class="loading">For example...

Static HTML & CSS webpage with a gray background for the content

That gives us a basic background, but we'd probably want to hide that text. When it's loading, we won't have that text yet, so most likely we would want to use filler text or a fixed height. Either way, we can set the color to transparent:

.loading {
  color: transparent;
  background: #eceff1;
}

Static HTML & CSS webpage with a gray background and transparent color for the content

If you notice with list elements, whether you apply the class to the top level list element (<ol> or <ul>) vs the list item itself (<li>), it looks like one big block. If we add a little margin to the bottom of all list elements, we can see a different in how they display:

li {
  margin-bottom: .5em;
}

Style difference between applying to the top level list or the list items

And now it's starting to come together, but it kind of just looks like placeholders. So let's animate this to look like it's actually loading.

Follow along with the commit!

Step 3: Styling and animating our loading class

Before actually animating our class, we need something to animate, so let's add a gradient to our .loading class:

.loading {
  color: transparent;
  background: linear-gradient(100deg, #eceff1 30%, #f6f7f8 50%, #eceff1 70%);
}

This is saying that we want a linear gradient that's tilted at 100 degrees, where we start with #eceff1 and fade to #f6f7f8 at 30% and back to #eceff1 at 70%;

Subtle gradient background that might look like a glare

It's hard to see initially when it's still, it might just look like a glare on your computer! If you'd like to see it before moving on, feel free to play with the colors above to see the gradient.

Now that we have something to animate, we'll first need to create a keyframes rule:

@keyframes loading {
  0% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0 50%;
  }
}

This rule when applied will change the background position from starting at 100% of the x-axis to 0% of the x-axis.

With the rule, we can add our animation property to our .loading class:

.loading {
  color: transparent;
  background: linear-gradient(100deg, #eceff1 30%, #f6f7f8 50%, #eceff1 70%);
  animation: loading 1.2s ease-in-out infinite;
}

Our animation line is setting the keyframe to loading, telling it to last for 1.2 seconds, setting the timing function to ease-in-out to make it smooth, and tell it to loop forever with infinite.

No change – it's not animating

If you notice though after saving that, it's still not doing anything. The reason for this is we're setting our gradient from one end of the DOM element to the other, so there's nowhere to move!

So let's try also setting a background-size on our .loading class.

.loading {
  color: transparent;
  background: linear-gradient(100deg, #eceff1 30%, #f6f7f8 50%, #eceff1 70%);
  background-size: 400%;
  animation: loading 1.2s ease-in-out infinite;
}

Now, since our background expands beyond our DOM element (you can't see that part), it has some space to animate with and we get our animation!

Our loading animation!

Follow along with the commit!

Part 2: Using our loading animation in a dynamic app

Now that we have our loading animation, let's put it into action with a basic example where we fake a loading state.

The trick with actually using this is typically we don't have the actual content available, so in most cases, we have to fake it.

To show you how we can do this, we're going to build a simple React app with Next.js.

Step 1: Creating an example React app with Next.js

Navigate to the directory you want to create your new project in and run:

yarn create next-app
# or
npm init next-app

It will prompt you with some options, particularly a name which will determine the directory the project is created in and the type of project. I'm using my-css-loading-animation-dynamic and the "Default Starter App".

Creating a new project with Next.js

Once installed, navigate into your new directory and start up your development server:

cd [directory]
yarn dev
# or 
npm run dev

Starting development server with Next.js

Next, let's replace the content in our pages/index.js file. I'm going to derive the content from the previous example, but we'll create it similar to how we might expect it to come from an API. First, let's add our content as an object above our return statement:

const content = {
  header: `So, how 'bout them Knicks?`,
  intro: `What are their names? I'm Santa Claus! This opera's as lousy as it is brilliant! Your lyrics lack subtlety. You can't just have your characters announce how they feel. That makes me feel angry! Good news, everyone! I've taught the toaster to feel love!`,
  list: [
    `Yes! In your face, Gandhi!`,
    `So I really am important? How I feel when I'm drunk is correct?`,
    `Who are those horrible orange men?`
  ]
}

To display that content, inside <main>, let's replace the content with:

<main>
  <h1>{ content.header }</h1>
  <p>{ content.intro }</p>
  <ul>
    { content.list.map((item, i) => {
      return (
        <li key={i}>{ item }</li>
      )
    })}
  </ul>
</main>

And for the styles, you can copy and paste everything from our Part 1 main.css file into the <style> tags at the bottom of our index page. That will leave us with:

Basic content with Next.js

With that, we should be back to a similar point we finished at in Part 1 except we're not actively using any of the loading animations yet.

Follow along with the commit!

Step 2: Faking loading data from an API

The example we're working with is pretty simple. You'd probably see this coming pre-generated statically, but this helps us create a realistic demo that we can test our loading animation with.

To fake our loading state, we're going to use React's useState, useEffect, and an old fashioned setTimeout to preload some "loading" content, and after the setTimeout finishes, update that content with our actual data. In the meantime, we'll know that we're in a loading state with a separate instance of useState.

First, we need to import our dependencies. At the top of our pages/index.js file, add:

import { useState, useEffect } from 'react';

Above our content object, let's add some state:

const [loadingState, updateLoadingState] = useState(true);
const [contentState, updateContentState] = useState({})

And in our content, we can update the instances to use that state:

<h1>{ contentState.header }</h1>
<p>{ contentState.intro }</p>
<ul>
  { contentState.list.map((item, i) => {
    return (
      <li key={i}>{ item }</li>
    )
  })}
</ul>

Once you save and load that, you'll first notice we get an error because our list property doesn't exist on our contentState, so we can first fix that:

{ Array.isArray(contentState.list) && contentState.list.map((item, i) => {
  return (
    <li key={i}>{ item }</li>
  )
})}

And after that's ready, let's add our setTimeout inside of a useEffect hook to simulate our data loading. Add this under our content object:

useEffect(() => {
  setTimeout(() => {
    updateContentState(content);
    updateLoadingState(false)
  }, 2000);
}, [])

Once you save and open up your browser, you'll notice that for 2 seconds you don't have any content and then it loads in, basically simulating loading that data asynchronously.

Follow along with the commit!

Step 3: Adding our loading animation

Now we can finally add our loading animation. So to do this, we're going to use our loading state we set up using useState and if the content is loading, add our .loading class to our elements.

Before we do that, instead of individually adding this class to each item in the DOM, it might make more sense to do so using CSS and adding the class to the parent, so let's do that first.

First, update the .loading class to target our elements:

.loading h1,
.loading p,
.loading li {
  color: transparent;
  background: linear-gradient(100deg, #eceff1 30%, #f6f7f8 50%, #eceff1 70%);
  background-size: 400%;
  animation: loading 1.2s ease-in-out infinite;
}

Then we can dynamically add our class to our <main> tag:

<main className={loadingState ? 'loading' : ''}>

Note: if you use Sass, you can manage your loading styles by extending the .loading class in the instances you want to use it or create a placeholder and extend that!

And if you refresh the page, you'll notice it's still just a blank page for 2 seconds!

The issue, is when we load our content, nothing exists inside of our tags that can that would allow the line-height of the elements to give it a height.

No height when there's no content

But we can fix that! Because our .loading class sets our text to transparent, we can simply add the word Loading for each piece of content:

const [contentState, updateContentState] = useState({
  header: 'Loading',
  intro: 'Loading',
  list: [
    'Loading',
    'Loading',
    'Loading'
  ]
})

Note: We can't use an empty space here because that alone won't provide us with a height when rendered in the DOM.

And once you save and reload the page, our first 2 seconds will have a loading state that reflects our content!

HTML & CSS loading animation

Follow along with the commit!

Some additional thoughts

This technique can be used pretty broadly. Being a CSS class makes it nice and easy to add where every you want.

If you're not a fan of setting the Loading text for the loading state, another option is to set a fixed height. The only issue with that is it requires more maintenance for tweaking the CSS to match what the content loading in will look like.

Additionally, this won't be perfect. More often than not, you won't know exactly how much copy you have on a page. The goal is to simulate and hint that there will be content and that it's currently loading.

What's your favorite loading animation?

Let me know on Twitter!

Join in on the conversation!

Taking inspiration from a culinary great

If you’ve seen the Pixar movie Ratatouille, you should know who Chef Gusteau is. He helped our “little chef” Remy the rat navigate the culinary world and become the top chef of Paris.

Remy from Ratatouille overlooking Gusteau's in Paris

Throughout the movie, we get a lot of great quotes on their journey. But the one we're interested in here is Gusteau’s motto, and the title of his book, “Anyone can cook!” So how can we apply this and the lessons to our own mapping journey?

I’ll admit, part of the fun here was translating some of the lessons learned from one of my favorite movies, but there’s a lot to take in here. I'm going to walk through some examples and types of maps that should get you motivated to get started with your own mapping application. So let’s dive in!

Get inspired by learning about maps and the impact they have on the world

Food always comes to those who love to cook. - Chef Gusteau

Through my work, I’ve found it easy to fall in love with working on maps. Every day, scientists use maps to visualize data that can assist them in making more effective decisions. This directly translates to benefitting people all around the world and saving lives.

With this inspiration, you'll be taken on a journey to learn more about the different types of maps in this world and how they’re being used. You even might stumble upon some interesting data that explores your own neighborhood!

Active fires around the world

Take for instance NASA’s FIRMS service, which provides a realtime look at active fire data around the world.

Active fires around the world via NASA FIRMS

Fires are a real-world example of disasters that we can learn from. This tool is used to help manage resources for stopping and preventing those fires by allowing scientists and those that are curious to analyze burn areas and model the data itself.

Global cases of COVID-19

And something very current, cases of COVID-19 (Coronavrius) around the world by Johns Hopkins Center for Systems Science and Engineering.

Global cases of Coronavirus (COVID-19) from John Hopkins CSSE

This map tracks the spread of the virus in real time, allowing scientists to model it's coverage and produce study results to share with the global community.

Mapping tools like this provide an effective means of giving as much information as possible in a way that’s easy to understand to the people who can make a difference with the information.

Increased life expectancy

On a more positive note, we can get a detailed look over time of how life expectancy is improving around the world.

Life expectancy in 2019 from Our World in Data

While it’s increased more in some areas than others, the global improvements are clear, and we get to see this rise in some countries from hundreds of years ago!

Explore the beauty of maps and applying data to them

How can I describe it? Good food is like music you can taste, color you can smell. There is excellence all around you. You need only to be aware to stop and savor it. - Chef Gusteau

There’s also a creative side and beauty to great maps. Thick datasets applied to a map (or any medium) can often become literal works of art.

The Room of Change from Pentagram

Whether showcased in an exhibit or one of the many options to purchase on Etsy, presenting meaningful data in a beautiful way can be impactful not just from an informational perspective, but also a cultural one.

Sometimes the interactions can be fun

Maps can also provide some interactivity that makes them fun to explore while you learn more about the dataset, like this globe that maps out global commodities from DailyFX.

Global Commodities interactive map from DailyFX

Though the data can frequently be thick and boring on its own, that doesn’t mean we can't find more interesting ways to present the data to interact with.

And sometimes maps can provide a listening experience

This map from at radiooooo.com allows you to travel around the world and through time.

Music Radio from radiooooo.com

Their use of a map makes it easy to identify the part of the world the person wants to explore.

Stop and appreciate the maps around you

Whether you notice it or not when you’re browsing the web every day, you most likely run into visualizations of datasets that create powerful ways to present that data in a way that’s more easily understood.

_u/dancingchopstix's recordings of their truck driving travels_

Luckily, we don’t have to work hard to find this inspiration, as we can visit aggregations of beautiful maps and general datasets like that of /r/dataisbeautiful.

Experiment, be creative, explore other ways to visualize data

You must be imaginative, strong-hearted. You must try things that may not work, and you must not let anyone define your limits because of where you come from. Your only limit is your soul. - Chef Gusteau

Maps come in all shapes and sizes. While shaded geographic areas typically work well with election results, it might not work as well for showcasing your summer road trip.

50 State Project road trip map

Exploring common map types

You’ve probably experienced more map types than you realize. Given it’s a powerful way to present data, maps are used frequently across the web.

A choropleth map is commonly seen for election results and regional datasets where a particular geographic location represents a point of reference.

CNN Map of Democratic primary after Super Tuesday

Heat maps on the other hand allow you to reflect on the intensity of a data point over a given area. This is powerful when you want to represent both the area covered of a dataset but also range the data represents at the same time, such as population density.

ArcGIS GPW 2015 Population Density heat map from

Learn from others, but don’t be afraid to create a new path

Explore and play around with different techniques to visualize data on a map. There’s frequently not one way to do it, meaning you can be creative and experiment with different ways of presenting your map.

But that also means you don’t need to be stuck working within the constraints of the common map types. Use the tools available or create new ones and break new ground. The most important thing is presenting the data in a way that will provide the most impact to those consuming it.

Don’t give up, learn from your experiences

What I say is true — anyone can cook... but only the fearless can be great. - Chef Gusteau

While there may not always be a right way, there sometimes are wrong ways. But don’t let failure stop you!

Take these failures as a learning experience in your journey of creating interesting and effective maps. By being bold with your experimentation, you’ll find yourself discovering techniques or creating new ways that can ultimately help people better understand map data.

You don’t have to be a cartographer to build great maps

Not everyone can become a great artist; but a great artist can come from anywhere. - Anton Ego

Towards the end of Remy’s journey, the food critic Anton Ego who was once critical of Gusteau's claim that “anyone can cook” came to a realization of what our chef truly meant.

Ratatouille critic Anton Ego's revelation

While it’s not reasonable to assume that every single one of us will be a great mapper, everyone has the opportunity to try and explore the medium.

And it certainly helps that we have plenty of tooling to help us get there. Whether building your own with Leaflet or identifying a few locations on a Google Map, the resources and community around mapping are endless.

Jump in with some resources to get started

For the developers out there who are inspired to get started, here are a few resources to start off with mapping:

• How to build a mapping app in React the easy way with Leaflet
• How to Visualize Air Pollution using Folium Maps - An In Depth Tutorial
• How to integrate maps in React Native using react-native-maps
• How to create a Coronavirus (COVID-19) Dashboard & Map App in React with Gatsby and Leaflet
• How to set up a custom Mapbox basemap style with React Leaflet and Leaflet Gatsby Starter
• How to Create your own Santa Tracker with Gatsby and React Leaflet
• Building Maps with Impact on React and the JAMstack (Video)
• Gatsby Starter Leaflet
• Leaflet
• OpenLayers
• My Maps by Google

What’s your favorite map experience or tool?

Share with me on Twitter!

As a developer, practice is vital to your continued professional success.

The web moves fast. Just a year or two of contentment could leave you eating JavaScript's dust.

Yet many developers, regardless of experience, frantically ask: "Which project should I do?"

...only to receive these cryptic answers.

In hopes of preventing that, I'd like to share some advice that's been very beneficial to me.

Copy–until you can create

Consider the following quote...

Good artists copy; great artists steal. - Pablo Picasso

This doesn't mean rob your parents.

It means, while you're practicing, don't bother with original ideas. Just copy something and focus on perfecting your technique!

You can rewrite the source code line-by-line, do it totally independently, or somewhere in-between.

Everyone's Doing It

Aspiring artists and authors copy all the time. Whether it's redrawing or rewriting, mimicking a famous piece is a mind-opening exercise. You get to immerse yourself in the craft and not worry about formulating a good idea. All the focus goes toward improving your skills.

This applies to programming too! Myself and many other developers copy open source repos just to learn how they work. You discover techniques you might've never encountered before.

In his inspirational Medium Clap article, Emmanuel Ohans took this principle to the extreme. He figured out how to design his own project after copying countless Codrops repos.

It's not about plagiarizing original works–it's about improving your technique and drawing inspiration from others.

How You Can Do It

Find a project you'd like to copy, then pick one option...

1. Copy its source code line-by-line
2. Look at source code only when you're stuck
3. Recreate it 100% by yourself
4. Just do something!

All the choices are valid and beneficial. As you complete the project, research any syntax/patterns you find confusing.

Original = Coding last

If you only practice through original ideas, this will be your workflow.

1. Thinking of something
2. Research
3. Planning
4. Marketing
5. Design
6. Development (The very last step)

Looks pretty wasteful to me, unless you're running a startup company.

Copying = Coding first

For the ones who just want to code, consider this process instead.

1. Code an existing app that interests you

That's it! The process is now aligned with our goals. Instead of developing at the very end, we're now developing all the way through.

The idea, research, planning, and design are all taken care of. We can focus on the good stuff, unlike poor Harold here.

He'll never improve because he's stuck in the idea phase. Don't make his mistake! Spend your resources on practicing instead of idea-making.

If that's your goal, at least. ?

Want Free Coaching?

If you'd like to schedule a free 15-30 minute call to discuss Front-End development questions regarding code, interviews, career, or anything else follow me on Twitter and DM me.

After that if you enjoy our first meeting, we can discuss an ongoing coaching relationship that'll help you reach your Front-End development goals!

Thanks for reading

For more content like this, check out https://yazeedb.com!

Until next time!

When I started actively pushing content to Github, I did not push Open Source contributions, Components or anything of the like - I pushed poetry. I did this, because it is what I love the most, after coding. I remain ever grateful that I took the initiative to make my first git commit.

Now, I want to breakdown the process for new coders (and poets - hopefully ), so that they can become comfortable with working with Github too. I will be breaking down several ways to push content to Github. For the purpose of this article, I will assume that readers are familiar with Terminal usage (GitBash or otherwise).

Pushing to a new repository with a README file

There are just a few essential steps to this:

• Click the green Clone or download button on the repository page.
  

• Use the Clone with HTTPS option, and copy the link provided.

• Run git clone https://github.com/UserProfile/repository.git in the terminal. Here, UserProfile and repository will be replaced by the values provided in the copied link.

• Run git init in the terminal. This will initialize the folder/repository that you have on your local computer system.
• Run git add . in the terminal. This will track any changes made to the folder on your system, since the last commit. If this is the first time you are committing the contents of the folder, it will add everything.
• Run git commit -m"insert Message here". This will prepare the added/tracked changes to the folder on your system for pushing to Github. Here, insert Message here can be replaced with any relevant commit message of your choice.
• Run git push origin master. Note that the last word in the command master, is not a fixed entry when running git push. It can be replaced with any relevant “branch_name”.

How to push Existing Code to a new Github repository

"Coding is a beautiful thing. Anyone can learn to code!"

What you need to do:

• Copy the HTTPS link provided.
  

• Run git init in the terminal. This will initialize the folder/repository that you have on your local computer system.

• Run git add . in the terminal. This will track any changes made to the folder on your system, since the last commit. As this is the first time you are committing the contents of the folder, it will add everything.
• Run git commit -m"insert Message here". This will prepare the added/tracked changes to the folder on your system for pushing to Github. Here, insert Message here can be replaced with any relevant commit message of your choice.
• Run git remote add origin https://github.com/Usheninte/example.git in the terminal. Here, Usheninte and example will be replaced by the values provided in the copied link. This will push the existing folder on you local computer system, to the newly created Github repository.
• Run git remote -v. This does some git pull and git push magic, to ensure that the contents of your new Github repository, and the folder on you local system are the same.
• Run git push origin master. Note that the last word in the command master, is not a fixed entry when running git push. It can be replaced with any relevant “branch_name”.

So, that's it! I honestly believe anyone can learn to code. I have spent the past year, tutoring undergraduate students in Nigeria, on Software Development. Soon, I will be starting off my journey as an Entrepreneur-in-Training at the Meltwater Entrepreneurial School of Technology.

Start coding today!

It was the first years of the modern web. People were getting sick of waiting minutes for their connection to transfer the 8 bits of data telling them “Sorry, your password must contain an & or a %. Please try again.” They wanted more instantaneous feedback. Something that felt more like a desktop application.

Then finally on a rainy night in May of 1995, the great champion was born. His father, Brendan Eich, named him JavaScript after his successful grandfather Java.

(Karl Benz,the founder of Mercedes-Benz patent, is considered the father of the first practical motorcar, and JavaScript is the main engine of all browsers. This is what Brendan would look like if we called him the Benz of the web ?)

Mr. Eich, father of the champion

JavaScript: Rise of an empire

When JavaScript came into the world, no one was thinking it would be very popular like it is today. JavaScript was a true time saver because of its browser-side validations. But what happened that caused JavaScript to grow so fast?

Before I learn JavaScript, I used to write programs in the VB6 language. But VB6 wasn’t independent. It needed its own platform to run. One of the main reasons that JavaScript is so popular is that almost all devices have a browser. In short: JavaScript won’t limit you to a platform or type of device. You can run it on basically everything.

JavaScript’s progress and popularity is not a secret, but below you can see how JavaScript compares favorably with some other languages.

There are more contents on the web for JavaScript:

Search engines show the number of found results below their search; here is the search result for Java and JavaScript.

Google result for searching Java and JavaScript

There are more people who are learning it:

Stack Overflow tags and the number of questions that were asked for any tag, it can show us the number of people who are learning the tag which is a technology; Stack Overflow tags are also a good way to check how a technology is growing and its popularity.

JavaScript is the most popular tag of Stack Overflow

The most popular language on GitHub:

According to GitHub, JavaScript is the most popular language of GitHub followed by Java, Ruby and PHP.

JavaScript is already the most popular but it is still growing fast

Stack Overflow runs a survey every year, and this year’s survey result is very interesting and there are good things to learn from it. The picture below from the survey result shows that JavaScript is growing faster than before.

_Source: [Stack Overflow developer survey 2017](http://stackoverflow.com/insights/survey/2017/?utm_source=so-owned&utm_medium=hero&utm_campaign=dev-survey-2017&utmcontent=hero-questions#technology-languages-over-time" rel="noopener nofollow)

JavaScript is still misunderstood

All programming languages have their own rules, syntaxes and concepts, and each of them were made to be perfect in something, and none of them are completely perfect, we should not expect a programming language to be jack of all trades and master of none. That’s the reason many projects should chose different programming languages to bring better performance for each parts of their software.

It’s fair to say that JavaScript does not have some concepts that other programming languages have but it might come back to language design goals. One of the currently recognized problems with JavaScript is a lack of static typings that might cause problems in larger applications. That is why elegant TypeScript was created.

JavaScript was never really engineered to write large applications, it was in fact invented in about 3 weeks, in the mid 90s as a quick response to Java…, For Brendan Eich build it in 3 weeks and for having only 3 weeks, he actually did a fantasticjob, JavaScript was perhaps intended for a 100 or maybe up to a 1,000 lines of code, and now with regularity people are building 100,000 line apps, if not million lines apps. —Anders Hejlsberg, known for TypeScript, Turbo Pascal, Delphi, and lead architect of C# (source: this video, time: 01:20)

Without a doubt, JavaScript owes its progress to browsers and their support of good things such as responsive web design, WebGL, WebRTC and lots of more cool things that made JavaScript more useful. Nowadays, developers are using JavaScript for game development, data visualization, mobile applications, back-end development and other fun things as well.

Motivated to learn JavaScript or being a better JavaScript developer? Let’s get started.

Let’s say you already know some JavaScript or you’re a beginner. Don’t waste time and jump into your preferred IDE and start writing the codes you want.

The fastest way to learn is learn while doing, but there is a problem with this method. There are some tricks you don’t know or you never heard of them but you’re writing your codes without knowing them and it’s hard to learn those rules or tricks without reading them somewhere. You already know you can define a variable by using the var keyword, but maybe you did not know that if you don’t use the var keyword, the variable will be global regardless of its defined place.

You will eventually learn what you need to know but that is doing it the hard way. Indeed, one of the best places you can learn while doing isfreeCodeCamp, You can work through freeCodeCamp’s self-paced coding challenges, build projects, and earn certificates. it’s like diving into code but still knowing what you’re doing and learning tricks and rules in a fast and effective way.

The problem with learning JavaScript

There are many technologies and libraries for JavaScript that make it feel scary for beginners. There are some famous names that maybe you have never used and you hear about them constantly.

Some people think “What’s this Babel thing everyone is talking about. All the famous open-source projects are using it!” Or, “Wait — should I use Browserify orWebpack? Where did Gulp and Grunt came from? Ahhh, another new library or framework introduced last week! I can’t learn them all ?”

Yes, you can’t and you should not learn them all immediately. Those technologies, frameworks and libraries exist to help you work smarter, faster and easier. When you find something interesting that is worthwhile to use on your project or is an answer to one of your needs, then you should go ahead and learn it with a beautiful smile on your face while remembering the English proverb “necessity is the mother of invention.”

“I’d encourage folks to remember we’re all in the same boat and our tools are here to help us. If they’re not doing that, we should get them out of the way.” — Addy Osmani (Link to his story)

Finally, I would like to thank Grammarly because of their perfect tool, which let me write an article in English, even though I'm not a native English speaker. Try it even if you're a native English speaker

I still remember the dirt underneath my nails, the sounds of the bays, the clinking of the hammer, the revs of the engines. The long hours, the sore back, the showers that seemed to last 30–40 minutes.

Today, I write this from inside my home, preparing for my latest assignment as a coder. It’s a far cry from what was — and shows the purpose of following your dreams and making real life changes. Don’t worry: It’s not sappy. Here goes.

Getting into cars

Growing up, I was nobody special. I had no special trait that set me apart — either from the kids at school or within my own family. The only thing that set me apart was ADHD. If there was anything I wanted to learn and lock into my memory, I had to reread or practice it many times. I never did well in school — I was a C and D student — and I only did what was needed to just get by. I didn’t necessarily disagree with studying; I just didn’t like being told what to do or what to learn.

I also had trouble identifying interests or what I might be passionate about. The only thing I really enjoyed was playing video games. Then the first Fast & Furious movie came out. I remember watching that movie and becoming excited about the cars, all the engines, turbos, the colors, the sounds when the wheels peeled off the pavement. I was 15 years old at the time. I remember specifically being entranced by the import tuner culture.

That was the day my hobby for the race car life began. I eventually pursued this interest in import tuners by buying my first — a 2000 Honda Civic Si. It was a beat-up car, and neglected too. But it had a five speed manual transmission that ran and drove.

Discovering my superpower

When I was 18 years old (the year was 2012), I enrolled in Vatterott College. I had the goal of becoming a professional automotive technician and soon found myself on the school’s honor roll. But around that time, I dropped out. It was because I realized I had a special ability: The ability to teach myself anything.

For instance: The ’97 Honda Prelude. Instead of asking the instructors or a student above my level to help with repairs, I downloaded a service manual and would take the car into the school’s parking lot, tearing the car apart and fixing things that were broken. The learning was through trial and error but I realized — I’m fully capable of teaching myself.

Even the shop’s teacher was impressed: They would tell the other students to watch me as a I worked.

Then there was the debt. The three months enrolled in the college had landed me a little over $8,000 in student loan debt, and if I had stayed there for the full two year program, I would have been over $40,000 in debt, with an outstandingly high interest rate.

This confirmed my realization: I am fully capable of teaching myself and I can find a job out there that will pay me to learn as I go.

And I did just that. Soon after leaving college, I approached a local automotive performance shop that worked on anything that had an engine. They also modified cars and installed performance parts. Working for them, I was able to pay off my $8,000 debt in ten months.

I worked as an automotive technician from August 2013 until October 2017. I got really good at what I could and had a really great boss; however, it was hard labor, as we had a small five bay shop that would be booked 2–3 weeks in advance just for people to get their cars in for repairs.

Each day, I’d move between 15 and 30 cars to open the shop up, then move them all back into place to close down. About 90 percent of the time, I was outside in the weather — hot or cold, rain or snow, pulling engines, dropping transmissions and many other labor-intensive jobs.

It was around that time that I got tired — both my body and my mind. I was weary of working in such conditions, and the pay wasn’t really that great. I wanted more out of life and because I was a homeowner with an expensive car hobby, the income of being a mechanic wasn’t enough.

I knew there was more: A job where I could live comfortably and not have to work nearly as hard to keep the bills paid. It was around the beginning of 2017 when I finally began to get serious. I knew that for my life to change I needed to take action.

Although every day I worked, I would get destroyed, be tired, exhausted, and nine out of 10 times filthy from the dirty work, I’d go home and start learning about what I could do. I looked at many things: buying and selling products online, retail arbitrage, starting a drop-shipping company, building passive income. I also looked into careers, ones that could lead me to a high-paying comfortable lifestyle.

The goal was to work remotely and make great money. I tried many things, but nothing seemed to work for me. I never gave up. I knew something would click with me as something that would interest me and lead to the life of my dreams.

Making changes

Then a friend of mine, who I worked alongside at the automotive shop, got a night job configuring, diagnosing, and repairing routers. He was doing Cisco CCNA work and had no college education or prior work experience that would’ve led to getting this job. He was paid well (if he did this full time for the company he would have made six figures) and had gotten the job just from a reference. I couldn’t believe it.

At that time, the bills from my first home were putting pressure on me. And here he was, working remotely, not doing any physical labor, and getting paid very well. He basically faked it till he made it — and made it, you can bet, he certainly did.

He told me, “Start learning Cisco CCNA work. If a position opens up, I’ll try to get you in.”

So I started researching online courses and schools that offered CCNA Certification classes. It was around July 2017 that I stumbled onto a local school that offered the course. It was called New Horizons Computer Technology. I submitted my information and got a call from a recruiter.

We chatted for a good 30 minutes and he explained that the courses I wanted were pricey: $6,000 total cost for the two weeks of classes. I was disappointed. I was living close to paycheck to paycheck and generally only had enough money to covers bills and save up a little.

The recruiter understood. He told me about a special Tennessee grant program for adults below 25 years old who made less than $30K yearly that would pay for the courses, making them free. I was only 24 years old and it gave me hope.

He sent me to an orientation where I brought specific documentation such as a high school degree, birth certificate, and pay-stub, to prove I was qualified. They collected the information and sent it off. Nearly three weeks went by before I finally got the phone call.

They’d pay for the courses.

Overwhelmed with excitement from this new possibility, I began fulfilling all of the requirements for enrollment at the school. A couple of weeks passed, the school and I came to an agreement that because I had no prior experience with Cisco computer work, I would take Comptia A+ for the first two weeks, with merging into Cisco in the second set of two weeks.

Even though I had little experience, I would do whatever it took to learn so that when a position opened up, I would be ready to get it.

The classes ran like a typical work week: Monday through Friday, 8am until 5pm, for four total weeks. The good part, which made this financially viable, was that I could choose on which weeks to take the courses. This brought me hope: ‘I have a way,’ I thought, ‘to get out this daily cycle of hard labor work and living paycheck to paycheck.’

The date was set for October 2017.

But I also knew that my work wouldn’t approve of me taking off for such an extended period of time. It was a step, and a big one. I chose to put my two weeks’ notice in on the first Monday of October.

I was placing all my money down on this set of cards — this new possibility of a new career choice. Don’t get me wrong: I’ve never left a job without having another job lined up. I had several part time jobs available, supervisors who were willing to hire me on the spot if things got too hard.

A couple months prior to leaving work, I had made a plan. I saved as much of my paychecks as I could. I cut costs and bills, things I didn’t need, such as the Netflix bill. I realized I had to put all my momentary needs on hold if I wanted to change my life.

I also timed things well. I spread out my classes so that I could take side jobs as an electrician, carpenter, computer repair person, and auto technician, for instance. As an “if all else fails” back-up plan, I had a stockpile of named brand performance parts that I had accumulated from years for a project car. I could sell these if nothing else.

I had a plan and was moving forward but it was difficult. I could no longer buy things for loved ones and still had a mortgage over my head. It was extremely daunting and I was fearful, but I couldn’t let my fear take over me. I worked to strengthen myself.

I started to research successful people, and not just the wealthy. Some inspirations came from those who built successful companies. Apple, Dell, Tesla, Space X. Elon Musk was a huge inspiration.

Motivational videos and self-improvements videos were constantly running on my phone and computer. When successful people spoke, I took note of their habits, as I had learned that success starts with a daily routine of small habits, an insight I applied instantly.

December of 2017 approached. I was in the final week of my CISCO class and I realized it was nearly impossible for someone to learn everything about the two certification tests — ICND-1 and ICND-2 — in just a matter of two weeks.

At the same time, the school’s advisor was notifying me of any entry level IT job openings. But I was discouraged. I attended interviews and hiring events only to be told my starting hourly rate would be $14, because I didn’t have a magical IT background or a college degree.

I’m sure you can feel my frustration here. I had worked hard to get this far and taken a huge risk. The last day of classes came and went. I crammed down all the knowledge and soon learned that I hated the stuff in the CISCO classes. It was dry, boring, and mixed with my ADHD very difficult to stay focused on.

The situation was like this: The first round of tests were paid for thanks to the grant; however, if I failed, I had to pay the cost of the tests. These were around $300 a test and even if I passed, I would still start out making less money than a full-time mechanic. And I knew, with my bills, that wouldn’t work.

It would take three to six months to study for them. I decided not to take them, which was a bitter pill to swallow. I had invested so much time in the course already, and that I thought this was my “golden ticket.”

The disappointment stung.

The end of December approached and I still didn’t have a plan of action going into the new year. I wanted a job in the IT field but couldn’t work for years at the lower levels, earning little income. But I trusted my motivation. I needed to keep trying different things, investing in myself, working side jobs until I found what I wanted.

The game-changer

January 2018 came. I was listening to a motivational video of a very successful person. He said, “If you want to be successful, then you need to surround yourself with successful people.” Then he mentioned something specific: An app called MeetUp.

I downloaded it soon after, and it became the best decision of my life.

In the app, I soon searched for technology and found a subcategory called Blockchain. I knew very little about it, just having a coinbase wallet with a small amount of money invested in bitcoin, ethereum, and litecoin. But it sparked my curiosity. It caught my attention.

A list of local meetups popped up. The one with the most members was called Blockchain901 (901 being the area code of Memphis) and they had a meeting scheduled for end of January, just three days after I had downloaded the app.

Do you believe in destiny?

Here is where I think it came into play.

Because, at the same time I was looking into blockchain, I was exploring the option of real estate. People made a lot of money in real estate and it was a way to build up a great deal of passive income. And, you could’ve guessed it, the soonest meetup was scheduled for the exact same date as the blockchain meetup, and at the exact same time.

I pondered. Both events were in different parts of the city. The one I picked would be the one I stuck with.

When the day came, it was pouring rain. This was either a sign: Not to go or overcome an obstacle. I had no idea what I was getting myself into, and I knew that either choice would remove me from my comfort zone. But this was necessary: To make my dreams come true, I had to buckle down and step outside of it.

I wrote down pros and cons, for both the real estate meetup and the blockchain meetup. With real estate, I knew I would struggle. I had little money saved up for investing. But the blockchain meetup posed opportunity. I could invest myself in knowledge of blockchain, which might lead to a better paying job. I felt my odds were greater with blockchain, and I followed through.

I drove through the storm to the FedEx Institute of Technology, which was on the University of Memphis campus. When I arrived, I was nervous. I didn’t know what to expect. I was several minutes early, walking across campus, and the room was already full. I was blown away.

Luckily, there was a seat open at the very front of the room. I quickly walked to it and sat down with my notebook. The large crowd might have been due to a specific reason: There was a special guest speaker flown all the way in from Taiwan (he was a big player in the blockchain industry called Everex). Alongside the guest speaker was a local Memphian called Brian.

As the door closed for the meetup to start, I took a look around. It was a massive classroom where every seat was filled and people lined the walls standing up, preparing to hear the speakers. There had to be 100 people in a classroom meant for around 60.

There were introductions. Brian introduced himself as a local Memphis software developer who specialized in blockchain and was also starting up a blockchain company in Memphis.

As the two hours of the meetup flew by, I took many notes and asked several questions. When it ended, people began to disperse, and I summoned the courage to approach Brian.

Ignoring my nervousness, shyness, and anxiety, I walked right up and said, “Hey, man, loved the speech and lessons from the class. I wanted to ask you if you guys had any positions opening up or if I could come hang out and learn from you.”

Brian was baffled and caught off guard.

As he hesitated, another man quickly approached and introduced himself as Aaron. He said, “You really wanna learn this stuff?”

“Absolutely,” I said.

“Good, then here’s my contact info. You are going to meet me downtown at this address.”

I had a huge mix of emotions. On the one hand, I was exploding with excitement for what could go right, but on the other hand there was a good amount of doubt and fear of the unknown.

Brian chatted with Aaron for a moment, then said to me, “Totally go with Aaron. He’s a good guy and will show you what you need to start doing.”

Between the meetup and my scheduled meeting with Aaron, I did what I was supposed to do. On February 2nd, 2018, I wrote my first line of code and made my first Git push to github. I followed up with Aaron, confirmed the time and place.

Heading towards downtown Memphis, I approached the address given to me. It had led me to a massive 19-story skyscraper. He had told me to meet up on the 19th floor. I remember thinking how crazy — me meeting this man at the top floor of a massive skyscraper.

I approached the room and knocked on the door. Aaron opened it and quickly I noticed all the windows overlooking nearly all of downtown Memphis. In the room was a table with just his MacBook on it.

He sat me down and showed the project he was working on. There was the front end and the code that changed was basic HTML and CSS, and I had no experience with either. He instructed me to figure out how to change the front end and add some styles to it.

Not knowing what to do, I googled my heart out. I looked for the knowledge needed to accomplish this task a mix of emotions were running through me — desperation, fear of failure, excitement. Surprisingly enough, I caught on quickly. That old ability — to teach myself anything — took hold.

Aaron saw my potential. He gave me some advice: To use my free time studying on a site called freeCodeCamp. Then, after a few days of working with him, he made me an offer of paying me hourly out of his pocket to continue helping him with his project. It wasn’t much, but it was something, and it was much better getting paid to learn rather than the other way around.

Weeks went by. I continued meeting with Aaron during the late weekend night and coding nonstop for 8+ hours. During the weekdays, I worked my side jobs and spent my free time studying.

This opportunity gave me hope for the future.

Success at last

In time, I met Brian again and the rest of the Web3Devs team. They gave me more tasks to see how I would handle them and I exceeded expectations — because I was determined not to fail.

On August 21, 2018, I received my first salary paycheck as a junior software developer from Web3Devs. Since then, I have been given more responsibilities, taking on clients, handling meetings, scheduling events, and much more — still while coding and studying.

Soon, they were taking me on trips to hackathons.

On September 6th, 2018, we flew out to Wyoming for the Blockchain Hackathon. I was excited — collecting a salary while traveling. The Hackathon was a massive success. We won four bounties, including a first place prize. It was a divine moment being on that stage while the event was live-streamed.

Two weeks later, we went to Atlanta for the ETH-Atlanta Hackathon, where we again won the first place prize.

As these events were happening, more work opportunities were coming around and more doors were opening for me. Soon, November 9th came and we flew out to San Francisco for the EOS-Hackathon. Competition was huge, as there were travelers from all over the globe and massive cash prizes.

Although we didn’t get first place, this was my favorite trip. We made tons of connections and I proved myself to the team. It was a massive success for me.

Then, as New Year’s Eve of 2019 rolled around, I looked back at 2018, how it started and how it ended. I started with no guaranteed paycheck or a game plan for how to change my life for the better. Things had gotten hard — the mortgage payments, the loss of income, the challenges of moving forward.

But things got better. I studied the habits of successful people. I applied what they said. The right opportunity presented itself and I moved forward, sometimes with doubt and sometimes needing courage, but I did just that and I achieved what I wanted to achieve — becoming a remote software developer and living the life that I had wanted and set out to do.

Final thoughts

What I’m trying to say in this story — and hopefully share and convey — is that no matter how hard things are, no matter how much weight is placed on your shoulders, no matter how many times you fail or struggle, never give up. Never quit fighting for what you truly want out of life. No matter what education you have or what job you work, you too can fulfill your dreams. If that’s coding, that’s coding, but it can be anything else. The lessons in this story can be applied to anything you are passionate about. You are the creator of your destiny.

Fin. (Extra sections below for those looking to get started into coding)

Some tips for you

Here are some extra tips if you’re starting out (or looking to start out) as a coder.

First, for a programming language, I recommend pursuing JavaScript. JavaScript is a scripting language that allows you to implement complex things on web pages. It consists of HTML, CSS, and variety of other frameworks such as nodeJS and React (a popular Facebook language). JavaScript can be applied to many things, including blockchain applications. It’s also easier to get an entry level job with JavaScript than other programming languages.

The websites I recommend are as follows:

freeCodeCamp.org is a completely free site for learning in detail about JavaScript, NodeJS, React, and many others. You have to teach yourself as there aren’t any videos. It’s just straight code.

Another site, uDemy.com, has excellent courses if you prefer to learn code alongside an instructor. These courses are in-depth and lengthy, some having 40+ hours of coursework. A double monitor method helps with the videos from the instructors. A good course I took and recommend is “The Modern JavaScript Bootcamp (2019)” by Andrew Mead. uDemy.com also has regular sales so you can snag courses for as low as $10.

Lastly, if you’re curious about getting started in blockchain as a programmer, then I recommend, after learning some JavaScript, a site called cryptozombies.io. It is a completely free game that teaches you how to write Ethereum Smart contracts using Solidity as a programming language, all while building a zombie army. The game was created to inspire and teach kids in middle school how to code and the game creators are always adding more chapters. Solidity is a lot like Javascript, making it a good start into blockchain.

All three things listed will make you a knowledgeable programmer. Always remember that habits are everything. Practicing every day for thirty minutes will make someone that much more advanced by year’s end. The progress may surprise you.

Former Gaza Code Academy facilitator Yasmin Hillis, a self-declared hippie at heart, talks about how Virginia Woolf inspired her to begin writing code

Yasmin Hillis studied English literature and taught English to children before shifting gears and studying web development with Founders and Coders, a peer-led coding bootcamp, where she recently finished her term as course facilitator. For several years, she’s been an avid practitioner of meditation and vegetarianism. In her spare time, Yasmin volunteers for local nonprofits and is teaching herself mathematics.

If Yasmin lived in London, where Founders and Coders is based, her story as a self-taught female programmer would still stand out. But the fact that Yasmin was born in Gaza, the most populous of the Gaza Strip’s five governorates, makes her accomplishments, and her relentless positivity, all the more extraordinary. In fact, with the Israeli border crossing mostly closed since 2007, and the Egyptian border crossing effectively closed since 2014, Yasmin has never left Gaza, a narrow strip of land just 25 miles long.

Yasmin, who graduated from the Gaza Code Academy, a joint project of Gaza Sky Geeks and London-based Founders and Coders, grew up under the thumb of the blockade, in circumstances most aspiring developers can hardly fathom: Gazans have, on average, only four hours of electricity a day, and 90% of Gaza’s water is unsafe to drink. According to the World Bank, Gaza’s unemployment rate, 43.9%, is the highest in the world. Unemployment among women stands at 55.2%, and workforce participation by women is just 19.7%.

Rebecca: Yasmin, I understand that before you decided to become a web developer, you studied English.

Yasmin: That’s right. I graduated from Al-Azhar University in 2016, where I studied English literature and fell in love with literary criticism, especially of poems by William Wordsworth.

When I finished, I worked as an English teacher for a number of organisations and for a summer camp organised by Amideast.

Rebecca: Reading novels in your second language isn’t for the faint of heart! Tell me about your first experience reading a novel in English.

Yasmin: Actually, it was Robinson Crusoe.

Rebecca: Your first novel in English was an about a man shipwrecked on a desert island?

Yasmin: I know, ironic, right? When I read about his life on the deserted island, his experience being cut off from society, I felt like every sentence could have been describing me. Maybe that’s what motivated me to persevere through the book. After reading the first two chapters, and looking up every other word in the dictionary, I resolved to sit for twelve hours a day with my nose in the book until I felt like I understood the whole story, and not just the individual words. It took me two weeks, but I did it!

Rebecca: You mentioned that you fell in love with Wordsworth’s poetry during university. Do you have a favorite poem?

Yasmin: It’s so hard to choose, but probably “I Wandered Lonely as a Cloud (Daffodils)” by Wordsworth. When I read it, I feel like I’m right there with him in the field of flowers, even though I’ve never visited a daffodil field myself before. His writing…it gives me the sense that I can smell something I’ve never smelled before, and it lifts me up whenever I’m feeling down and longing to connect with nature. The final stanza particularly resonates with me:

“They flash upon that inward eye

Which is the bliss of solitude;

And then my heart with pleasure fills,

And dances with the daffodils.”

Rebecca: So help me understand how you went from reading novels to writing code.

Yasmin: As a literature student, I spent lots of time searching the web for answers to the seemingly infinite questions sparked by the novels and literary criticism I was reading. At some point I realised that the websites I was using for my research had themselves been built by software engineers. Something inside me whispered, “Be the builder,” so I decided to take a gamble on learning to code.

Not long after, I saw an advertisement for She Codes, a short-term course run by Gaza Sky Geeks, on social media, and signed up right away. I joined the course and immediately started learning everything I could about coding, spending most of my free time reading articles and watching YouTube videos about programming as I worked my way through the prerequisites for the Code Academy.

I still remember how in my interview to join the Code Academy, after the technical questions, one of the panelists asked, if I could invite anyone to dinner, who would that person be. I said Virginia Woolf because from her novels you can see how enlightened she was in a time when women had so many rules imposed upon them by society, and as a fellow feminist living in a traditional society, I find her really inspiring.

Aspiring developers collaborate during an open meetup at the Gaza Sky Geeks campus

Rebecca: Obviously you’re not one to let rules stand in your way! Tell me about your experience on the course as someone with a non-technical background.

Yasmin: In the beginning, I had a hard time coping with so many new technical topics, especially since everyone else on my cohort had studied computer science or information systems. But one thing I did know how to do was to google, and I spent every scrap of time looking up the new terms and topics I encountered.

There were times when learning code felt like learning another language — something I’m familiar with, having learned English and conversational French. But I had a hard time wrapping my mind around concepts like code modularisation, because I just couldn’t accept the idea that a certain block of code is getting/sending its input/output from/to another block of code living somewhere else on the project.

Maybe it’s because in literature we don’t have the same concept — we usually deal with the piece of literature as a whole. So, coming to programming and finding that some files depend on others — my head was spinning!

Rebecca: I take it eventually things got easier. How did you find your footing?

Yasmin: It all comes down to peer-led learning. Unlike traditional learning methods, which focus on what students lack, peer-led learning gives us as learners the responsibility to teach each other. Through this process we also become more self-aware of our strong and weak points. Peer-led learning has taught me that no matter how much I know, I can always learn something from the process of working with someone else.

Rebecca: I’d love to hear about your first experience with peer-led learning.

Yasmin: My first experience with peer-led learning was during a pair programming exercise on the very first day of the course. The mentors paired us up and told us to work on a challenge on Codewars. I remember how just three days before the course started, I was working at home on a similar challenge, and it took me ages, and so much searching, to find the answer. When I paired, my classmate used a different pattern, naming the variables and dealing with the code in a way that helped me see the problem in a new light, and we got to the solution in a fraction of the time it had taken me before. Afterwards, I remember telling our mentors that when two minds focus on one single problem, there’s nothing we can’t solve.

Rebecca: And what was the best part of the course?

Yasmin: Our final project, which we worked on while mentoring the following cohort, was hands down the highlight of the course. We built an application to showcase the portfolios of Founders and Coders students, with Joe Tanner, Founders and Coders commercial manager, as our client.

Rebecca: Speaking of technical skills, in what ways would you say that coming from a non-technical background was an asset on your journey?

Yasmin: It’s interesting you ask that. I guess you could say I brought the ability to think through projects both technically and emotionally, you know, from the user’s perspective. Some of my classmates, who were so strong technically, would forget to think through the project from the perspective of the user.

Yasmin mentoring at the Code Hope hackathon in October 2018

Rebecca: You mentioned that you worked on this project while mentoring the next cohort. Many of our alumni say that they grow as much, if not more, while mentoring as they did when they were a student. Tell me about your experience as a mentor.

Yasmin: Mentoring taught me so much, starting with the fact that the best way to learn something is by explaining the concept to someone else. I remember standing up in front of the class explaining something about Node, even though I still hadn’t figured out the logic behind it myself. During my explanation, one of the students stopped me and asked me a question to the tune of, “Why does it work that way?” I found myself providing the answer and noticed another student nodding and saying, “Yeah, that’s right.” So I went back to my searching and saw that the answer I came up with, on the spot, was actually the right one.

Just yesterday, I was at home working through a mathematical problem. I found the problem hard and just could not find a solution to it, so I went to my mom, my mentor in self-learning math. I told her, “Mom, I can’t find a solution to this problem!” She asked me to explain the problem to her before thinking together about a solution. Lo and behold, as I was explaining the problem to my mom, I found the solution.

Rebecca: You said your mother is your mentor in self-learning mathematics. Would you consider her a role model?

Yasmin: Absolutely. My mother studied mathematics at IUG, Islamic University of Gaza, and is currently a teacher of mathematics for middle schoolers at a school for UNRWA in Gaza.

I guess it’s no accident that I became first a teacher, and then a facilitator. You could say that education is kind of a family tradition. My grandfather, rest in peace, who is originally from Gaza, studied English literature in Egypt before returning to Gaza to work as English teacher. He was eventually promoted to school principal, and then served as director of the UNRWA Education Department, Gaza area. My grandmother is also a teacher at an UNRWA school.

Having a strong female role models has been essential in my journey, as so many people here think women aren’t smart enough for work in tech.

Rebecca: Tell me about these naysayers.

Yasmin: Well, the dominant view in our society is that women are not made for tech and mathematics and science, and to put it bluntly, that women just aren’t intelligent. After growing up hearing this, some women even start to believe this and behave like it’s true. I’m grateful that my family has been so supportive of my educational and professional aspirations and that I have strong women as role models in my mother and grandmother.

Rebecca: I understand that while there are only a handful of women working as developers in Gaza, women make up half of the students at the Code Academy.

Yasmin: That’s right. We believe that women and men are equally well-equipped for technical work, and envision a Gazan tech sector that one day employs as many women as men.

Yasmin, as course facilitator, with a group of students from the Code Academy

Rebecca: You were the course facilitator for the fifth cohort of the Code Academy, which began during summer 2018. In your experience, how is facilitating different than teaching?

Yasmin: Interesting question. Teaching is about delivering an idea. Facilitating, on the other hand, is mostly about observing — we only intervene when we don’t think students can sort things out for themselves, or when one student’s actions have become harmful to themselves or others. As a facilitator, I pay close attention to the environment and the students’ personalities, and make adjustments accordingly.

Being a facilitator was by far been the most rewarding thing I have ever done. I was once floating around the room when students were working in pairs during a workshop. I noticed one student seemed particularly stressed and anxious. I approached her and asked what’s the matter but she assured me everything was fine. During the break, I decided to talk to her privately. This time, she admitted to me that she felt like an imposter, like she didn’t belong on the course and in the tech industry (which of course wasn’t true). I offered her advice and emotional support, which she later followed. A few weeks later, at the final project presentation, she displayed a firm grasp of the project as a whole. After the presentation, I talked to her and was so proud to hear her tell me she felt like she’d grown both personally and professionally.

Reviewing a team project during the fifth cohort of the Code Academy

Rebecca: And how did you grow from your experience as a facilitator?

Yasmin: Even more than when I was a student, facilitating has taught me the value of teamwork. Now I’ve been a team member several times before, but witnessing how teams in the room work and observing where they get into trouble has made me so much more aware of the importance of collaboration and communication.

When you are on the team, you can get overwhelmed by the tiny things in front of you and forget to pay attention to more important things. When you are someone who is observing team dynamics, you can more clearly see the big picture, and thus help the teams refocus during daily standups on projects. I frequently remind the classroom as a whole that paying attention to the big picture is important. Sometimes the big picture is the communication within the team. Sometimes it is maintaining the longevity of relationships and other times it is prioritizing the project and the learning process of others.

More than anything, this job taught me to be more patient. I learned to be patient with the rate of student progress, with team dynamics, with students who make the same mistake more than once. In life in general, I’m patient with my mind and body. I remind myself that everything takes time and if everything happens instantaneously, life loses one of its most interesting characteristics, suspense.

Rebecca: You say you’re patient with your mind and body. Outside of facilitation, how would you say you’ve learned the value of patience?

Yasmin: I’ve actually been practicing meditation for four years now. I’ve learned so much from my meditation practice, like how not to complain, compassion, patience, and self-awareness.

Rebecca: How did you get started with meditation?

Yasmin: Well, back in college, during exams, I was just so overwhelmed. I had the sense that my mind needed a rest, but I didn’t know how to provide that for myself. It felt like there were voices in my head, and they were fighting, but I couldn’t figure out how to quiet them down.

I decided to sit in my bedroom, on the floor, and close my eyes — instinctively, I think, we all know how to be mindful. I sat there, still and silent, for about fifteen minutes. When I finished, my mind felt more organised, I was calm, and my mood had improved. When I went to study I found my comprehension was so improved that I decided I had to research to find out what it was that I did.

I found a YouTube video with instrumental music for relaxing and I continued with meditating for a few months, almost every day, and eventually I learned about how controlling your breathing makes it easier and faster to relax and improves the mood. I still meditate whenever I can, using music, guided meditation, or mindfulness apps like Calm and Headspace. To be honest it’s hard to find a place to be alone and meditate, because houses here are crowded. But I steal moments for myself, because if I want to practice meditation and connect with nature, it doesn’t have to be a special place or time, just any place or time that I need it.

People here think I’m crazy for meditating, but what can I say, I guess I’m just a hippie at heart.

Rebecca: So where do you go when you want to be alone, to relax or to study?

Yasmin: Growing up, my favorite place to study was the balcony of my bedroom in our old house, where I’d read and sip a cup of tea in the fresh air. Today, I’d have to say I love visiting the sea. It’s where I feel relaxed, rejuvenated, and connected to nature.

_Photo of Gaza waterfront: [Stefanie Dekker/[Al Jazeera](https://www.aljazeera.com/blogs/editors-blog/2018/08/side-gaza-swimming-canoeing-child-180802084349283.html" rel="noopener" target="blank" title=")]

Rebecca: What about your career goals? What’s your dream job?

Yasmin: I loved working with the team at Gaza Sky Geeks, and I’m now looking for a role as a developer on an equally well-functioning team. I’d like to keep doing some project management, as I enjoyed the organisational aspect of facilitating.

Rebecca: Dream big for me. Imagine the blockade ends today and you can get a job anywhere in the world. Where would you go?

Yasmin: LONDON, of course!

To learn more about hiring developers in Gaza, visit agency.gazaskygeeks.com.

To apply to the Gaza Code Academy, visit www.gazaskygeeks.com/code.

Getting that rejection call or email is not pleasant. You feel disappointed, sad, confused, or teary-eyed. It is especially hard after getting so many no’s, or when you know that you are objectively an excellent candidate for the job. You start doubting yourself and wondering what you are missing.

While there is always room for improvement from your end, there is always room for mistakes from the other end. Those mistakes could be the worst ones of their careers and the biggest opportunities of yours. Treat each rejection as what it is — possibly the best thing that ever happened to you.

When doubt starts getting to your head because you received many rejections, remember that some of the greatest scientists and entrepreneurs were rejected many times, too. Those rejections have led to much better outcomes. Here are some of the rejection stories that inspire me to keep going in the face of rejections.

Albert Einstein

After graduating with a degree in mathematics and physics in 1900, Albert Einstein could not find anybody to hire him. He got rejected from all the schools and colleges to which he applied for a teaching or a research post.

He was struggling so much to find a job that he thought about switching fields and selling insurance! His father wrote letters to his friends, without telling Einstein, asking if they could get a job for his son, with no success.

After almost two years of unemployment, the desperate Einstein moved to Bern — the Swiss capital — where the father of one of his friends got him a job as a junior patent examiner. He worked there until 1909.

Einstein used to finish his tasks quickly and use the rest of his time to work on scientific research that interested him. During that time — specifically 1905 — he published four of the most important scientific papers ever published. These papers laid the foundation of modern physics in space, time, mass and, energy.

Srinivasa Ramanujan

Despite living in poverty for most of his life, receiving little formal education, and passing away at the age of 32, Srinivasa Ramanujan contributed substantially to the field of mathematics.

Ramanujan was able to get a scholarship to attend college. However, his strong interest in mathematics distracted him, thus he failed other subjects and was dropped from the scholarship. He enrolled in another college later and failed other subjects again.

With no college degree, he pursued his mathematical research independently. He lived in poverty and was going door-to-door looking for a clerical job. He would show prospective employers his work and send letters to mathematicians and colleges, detailing advanced theorems that he came up with.

Some didn’t respond to him, some thought he was a fraud, and some were impressed by the work he presented but doubted it was his. There were others, however, who gave him letters of introduction to other notable mathematicians.

His break came as a reply and a sponsorship from G. Hardy — a mathematician at Cambridge University — who recognized the work of a genius. Ramanujan traveled to the UK to work with Hardy, and become one of the youngest Fellows of the Royal Society in history, at the age of 31.

Jack Ma

Jack Ma, the founder of Alibaba and a global business leader, had his fair share of rejections. After graduating college from his home city of Hangzhou, China, he applied for 30 jobs and got rejected from all of them. He applied to be a police officer. Out of five applicants, he was the only one rejected.

He was even rejected by KFC. When they came to his home city, he tried to get a job with them. Out of 24 applicants, he was the only one rejected, he stated.

Later on, the rejections did not stop! Ma tried to get into Harvard Business School ten times, and got rejected every time. When he came to the USA in 2001 to raise $5 million investment, he got rejected. “…we [will] come back raising a little bit more,” he said.

Ma attributes his resilience and success as entrepreneur in part to the rejections he encountered all the way.

Brian Acton

Brian Acton, co-founder of WhatsApp, got his “best thing happened to me” rejections as well. In 2009, Acton —a software engineer with years of experience at Yahoo and Apple —got rejected by Twitter, then Facebook.

As no other company he aspired to join would hire him, he took the entrepreneurship route and started WhatsApp with Jan Koum — another Yahoo alum.

Five years later, the cloud-based messaging company co-founded by Acton changed how people text around the world. The company who rejected him earlier — Facebook — wanted him. This time, they had to pay $19 billion to acquire his company and hire him back.

Brian Chesky

In 2008, Brian Chesky, co-founder and CEO of Airbnb, was a “nobody” entrepreneur looking for someone to believe in him, his small team, and their idea.

Chesky and his team were looking for $150,000 investment for 10% of Airbnb. One of his friends introduced him to seven potential investors. Five of them rejected him, and the other two didn’t bother to even reply to him.

Ten years later, in 2018, Airbnb is the largest hotel company in the world. Rejecting Chesky’s 10% offer turned to be a $3 billion mistake for those investors now that Airbnb is valued at $30 billion.

Kevin Systrom

Systrom, the co-founder of Instagram, joined Google right after graduating Stanford.

He worked with Salar Kamangar — a senior Google executive— who was impressed by Systrom, and wanted to transfer him to Googles’s Associate Product Manager (APM) program.

The APM program is an elite rotational program at Google where a select few are chosen and given vital roles in real-impact projects.

Systrom was rejected because the program only accepted candidates with a computer science degree. This occurred despite Salar Kamangar’s efforts to convince his fellow executives to accept Systrom who “is a brilliant self-taught programmer with a history of working closely with engineers to ship products”.

Frustrated by the rejection, Kevin left Google to later co-found Instagram in 2010 and sell it to Facebook for $1 billion two years later.

The lesson

While rejection is a setback in the short term, it is a necessary step to potential significant outcomes in the long term that are unlikely to happen without it.

We have a choice. We can choose to get depressed over the rejections we receive because “we are not good”. Or we can choose to have faith that our future days want the superiority for us by getting in the way of inferiority. I choose the latter and I trust you do too!

Sources

[1] Einstein: Wikipedia, The Extraordinary Genius of Albert Einstein.

[2]Srinivasa Ramanujan: Wikipedia, Who Was Ramanujan?

[3] Jack Ma: Wikipedia, Rejection — Jack Ma.

[4] Brian Acton: Wikipedia, Forbes.

[5] Brain Chesky: Wikipedia , Brian Chesky’s Medium

[6] Kevin Systrom: Wikipedia, How Google Works

A couple of months ago, I was chatting to a developer at work about how I’ve always wanted to learn to code but never tried.

Coding always seemed like one of those skills that was incredibly powerful (hence the allure). At the same time coding felt hugely complicated and foreign.

Ever since I was an art student in college, coding, in my mind, always see-sawed between being geeky and glamorous. Glamorous because if you knew how to code that meant you were smart and successful. And geeky because, well, most depictions of programmers in popular culture look like this…

As a girl growing up in Dublin, I assumed you had to be ‘naturally good’ at computers to understand coding.

But I’ve learned that there is no such thing as ‘naturally good.’

The Difference Between Techies & Non-Techies

As a non-programmer, everything to do with tech, for the most part, seems foreign, complex and very difficult to grasp. There’s so much of it, and that becomes overwhelming.

This is exactly where the divide between ‘techies’ and ‘non-techies’ pops up. I’ll use myself as an example here:

When I’m trying to figure something out on my computer — let’s say, how to customize a new application — I’ll try hard at first by focussing on this one problem. I’ll focus on it so much that I also end up focussing on a single solution, over and over again.

Then I’ll get frustrated, then feel bad because I can’t figure it out, and then give up.

But when my partner tries to figure something out, he’ll do this:

1. Google
2. Test something out
3. Google again
4. Test something out again
5. Watch a few youtube tutorials
6. Read through some forums
7. Test something again

And usually, he’ll solve the problem. (And when he doesn’t, he’s not as frustrated as I usually am.)

I used to think he ‘got it’.

But actually he was curious (like me), and patient (not so much like me). It seems so obvious now. For a long time, I succumbed to thinking that we were two completely different types of people.

I was wrong.

The Intimidation Game

I’m 29, a woman, grew up in Dublin, studied art in college, moved to London to do an MA in writing, where I now live and work. And even though I never considered myself a ‘techie’ person, I’ve always been curious about programming.

I’ve also, always, felt too intimidated to try it.

All I’ve ever known about coding was what I saw in films and TV growing up in Ireland in the early 2000s. I watched nerdy archetypes in movies type at lightning speed, read nonsensical symbols in strange interfaces and hack into the system’s mainframe.

Suffice it to say, I never identified with these characters. And so, unsurprisingly, never thought of myself as someone who could do it.

Why Now?

Cut to 10 weeks ago. I’m chatting to the developer at work about all this alluring code stuff. She tells me about Codebar. It is a weekly meetup aiming to diversify the tech industry. Codebar organizes free coaching sessions for people underrepresented in tech.

Sounded like the thing — a place to learn to code that’s designed to welcome complete newbies like me. So I thought, sure why not?

Great Expectations

I went along to this meetup telling myself to be ‘realistic’ about what I wanted to achieve. You see when it comes to picking up new hobbies, I often have trouble managing my expectations. Most of the time I don’t have enough patience to wait for my skill set to level up to my enthusiasm. I get distracted by something else and the whole thing often fizzles out.

So walking in I said to myself, “Just take it one problem at a time. Don’t start telling everyone you want to become a developer.”

But here’s the thing: I want to become a developer.

I Want More

I’ve spent the last 10 weeks learning the most basic HTML and CSS and using it to build my first ever website (right now I’m experiencing the unprecedented joy of browser testing, so we’ll see how that goes later).

For any other complete beginners out there, I highly recommend the Codebar tutorials for a basic introduction. I recommend Flexbox Froggy for learning some cool front end displays. I recommend CSS Diner for learning everything there is to know about selectors.

And while it is crazy difficult and there are constantly so many new problems that I had no idea were lurking in the margins, there really is no high like figuring out why some code doesn’t work and then fixing it. My synapses go crazy every single time, and I love it.

For every problem I’ve come across, I try to be patient while figuring it out. Now I google, and test, and read through forums. I ask lots of questions even if I think they’re stupid because you know what? Who cares. I’m new at this.

What’s The Point?

My goal now is to become a developer in 6 months’ time.

Why 6 months? Because that happens to be when my work frees up. And if other people can do it, so can I, damnit. Just because I didn’t study computer science and didn’t know what Github was until a few weeks ago (still figuring that one out in full, to be honest), doesn’t mean I can’t get there eventually.

If you take one small problem at a time, you can manage it. And if you have kind people around you who are willing to help, all the better (and from my experience so far, the industry doesn’t have any shortage of this ❤).

As a complete code newbie, I’ll be documenting my journey on Medium from here on out. I will share the kinds of experiences and perspectives that I want others to share with me.

Hopefully, it will help other newcomers like myself realize that there are not just 2 types of people out there: those who just get it and those who don’t.

For me, this is lesson number one.

This article is for the writers of Medium. If you have ever been frustrated with the response your stories get, this article can help you.

My name is Harrison Jansma, and I write about data. Over the last few weeks, I collected and analyzed the claps of a million Medium stories. So I could answer the question that bothers me most as a writer on Medium. Namely,

How do my stories compare to those of similar writers on Medium?

Though I am a writer, I am not a particularly creative one. To cope, I have to motivate my writing through competition. Making goals for myself based on either the performance of my past stories, or the performance of stories in my news-feed.

Unfortunately, this comparison is slowly killing my ability to write.

The problem is that I’m setting goals for my writing without knowing if these goals are reasonable.

Which of these is a reasonable goal?

Stories in my home-feed range from 40 claps to 30K claps. The first three stories I wrote on Medium ranged from 80 claps to 9K claps. So do I make my goal to get thirty thousand claps? Ten thousand claps? Just how many stories actually reach that level of reader-engagement?

As long as claps appear to vary wildly from story to story, writers can never use this metric to make goals for their writing.

So I made it my goal to understand Medium’s claps better. I collected data from hundreds of thousands of Medium stories, ranging in topic from poetry, to tech, to politics. With this data I found exactly what I was looking for.

I found a way for authors to compare the performance of their writing to other, similar stories on Medium.

Scraping a million Medium stories.

The first step was collecting information. Specifically, I had to get the claps received from A LOT of Medium articles.

So I strolled around the Medium archives for a few days. Then I created a web-scraper in Python (found on GitHub). The web-scraper pulled data from thousands of story-cards.

Example of data scraped from a story-card.

Once data collection was completed, I had data on 993K Medium articles. They covered 36 of the most popular Medium tags, all published in the last year (Aug, 2017-Aug, 2018).

Analyzing (nearly) a million Medium stories

After removing duplicate-stories and comments from the data, I was left with 720K unique stories from 230K authors and 30K publications. The number of claps received for an article ranged from zero claps to 215K claps.

To better understand Medium’s clap metric, I needed to answer two questions.

1. How many claps does the average story get?
2. How many claps does an above average story get?

Let’s start with the first question.

How many claps does the average story get?

On Medium, most writers receive mediocre engagement from their readers. This might be because Medium is a free platform for writers. Or maybe because not every writer’s goal is to receive huge numbers of claps from their audience.

Whatever the reason, most articles receive almost no applause. Of the 720K articles I analyzed, 61.3% received less than 10 claps.

If you are a writer, you should not let this discourage you.

Whether it be the time of day, or the mysteries of Medium’s recommendation engine, the engagement your stories receive is not really up to you.

However, the most successful authors on Medium didn’t get where they are by chance. They posted high-quality content (consistently) for a long time, and gradually built a following.

You can do the same.

How many claps does an above average story get?

Now that you know how many claps most stories receive, we will look at the other end of the spectrum: the stories that received more claps than average.

Unfortunately, there isn’t a distinct number of claps an article needs to be above average. What we need is to rephrase the question a bit. Instead we ask:

How many claps do the top 1% of stories get?

Of the 720K stories analyzed, the top 1% most-clapped stories received more than two thousand claps.

This cutoff falls at exactly 2000.0 claps, rather than a number like 2112 because of the way the data was collected. Once you pass one thousand claps, Medium abbreviates your claps-received (ex. 2.2K). So the strict cutoff is somewhere between 2K and 2.1K. But two thousand is much cooler sounding… Sooo…

So two thousand claps is the cutoff for a story being in the top 1% of Medium stories. From now on, when you write a story, you can use this as your goal for reader engagement. You can also use this as a benchmark to measure the performance of your past articles.

Two thousand claps is also a pretty good metric for your performance as an author.

Writing a story in the top 1% is no small feat. Of the 230K authors in the data, only 1.2% had written an article with more than two thousand claps.

Even fewer authors were able to post articles with more than two thousand claps consistently. The following graph shows what I am talking about.

But be advised, this cutoff for the top 1% includes articles written for vastly different genres.

Can we really compare the performance of a poetry story to that of a self-improvement story? Each has a vastly different audience, varying in size, taste, and personality.

Luckily, Medium already separates its content with tags. All we need to do is find the top 1% of each tag on Medium.

How many claps do the top 1% of each tag get?

Here are the 99th percentiles of claps-received by an article for each of the 36 tags in our data.

Some of Medium’s most followed tags (Self-Improvement, Productivity, Life-Lessons) have the highest cutoffs for being in the top 1%. While the tag with the most stories (Travel) had the lowest cutoff.

I haven’t been able to come up with a reason for this spread, so I would love to discuss this more in the comments.

Here are the individual 99th percentiles for each of the 36 story tags.

So there we have it! You can use the above numbers to compare the performance of your stories to that of similar authors on Medium.

For example, since this article has a data-science tag, I might make it my goal to get 2900 claps. If I could accomplish that level of reader-engagement, this article would be in the top 1% of data-science related articles on Medium.

Conclusion

Most Medium stories get less than ten claps, and the top 1% of Medium’s stories receive more than two thousand claps. You can use these metrics as benchmarks to measure the performance of your articles, or as a goal in writing future articles.

I also included the cutoff for the top 1% of 36 popular story tags, so you can compare your work to that of similar authors on Medium.

Follow me if you want more high-quality data science articles. ?

_There were a few things I learned about Medium that aren’t directly relevant to this article. So I wrote a comprehensive analysis of everything I found. If you want to know who were: the most clapped authors, the biggest publications, and much more, look here._

People like to look at changing the world as a big task. I believe changing the world can be done in little steps.

The key is identifying a problem and taking a little step.

My journey began on Friday, September 7th, 2018. That was the day I decided to build a React plugin for the freeCodeCamp Test Suite. I noticed a problem and I took action.

There is a working version up for installation on the Node Package Manager registry. This is a milestone for me, as the project is my first Open Source contribution.

I used certain key technologies to build the project, like Webpack, React, NPM, and Node.js. I had a lot of fun building it, and I learned a lot, too.

I tried several times (for a whole day actually) before I could even succeed in making the plugin work.

After making it work, implementation in a React app was a challenge. Although I was faced with technical difficulties, in the end, the plugin worked.

The process

The idea behind the project was simple. All I wanted to do was find a simple way to add the freeCodeCamp Test Suite to React apps.

My first plan was to build it with Create-React-App.

I felt that since I could use it to build React applications, I could use it to build a plugin. I was wrong.

Create-React-App was too heavy for what I needed to build.

I discovered that to make the plugin easy to export, I would need some extra configuration.

I went online and googled a couple of times, and came across Webpack and react-helmet. What I came across was both amazing and confusing, at first.

Still, I knew they were what I needed. I continued searching some more.

Before Webpack, I had tried exporting and publishing the plugin as a module with no extra configuration. It did not work. Newbie mistake, I know.

This was a big challenge that I had to overcome.

Thankfully, we learn as we grow!

While I was developing the plugin, there were constant power cuts. In Nigeria, the power situation is not very settled.

I had to work until my laptop powered out, then think deeply about what to do when power returned.

All of this happened on the second day (Saturday).

The magic, the beauty

Using Webpack, I began building the plugin.

I placed the core code in an index.js file. Here is the code below:

import React from 'react';
import { Helmet } from 'react-helmet';
import './styles.css';

const ReactFCCtest = () => {
  return (
    <div>
      <Helmet>
        <script type="text/javascript" 
                src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js" >
        </script>
      </Helmet>
      <h5>react-fcctest running</h5>
    </div>
  );
};

export default ReactFCCtest;

The code above was all I needed to add the script to the head tag of any React app I desired.

I came across an article on Medium which was a great help to me.

It helped me understand how to use Webpack to create a node module that I could successfully publish to the Node Package Manager registry.

I followed the instructions in that article. After making some changes, I built the following webpack.config.js file:

const path = require('path');
const HtmlWebpackPlugin = require("html-webpack-plugin");
const htmlWebpackPlugin = new HtmlWebpackPlugin({
    template: path.join(__dirname, "demo/src/index.html"),
    filename: "./index.html"
});
module.exports = {
    entry: path.join(__dirname, "demo/src/index.js"),
    output: {
        path: path.join(__dirname, "demo/dist"),
        filename: "bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                use: "babel-loader",
                exclude: /node_modules/
            },
            {
                test: /\.css$/,
                use: ["style-loader", "css-loader"]
            }
        ]
    },
    plugins: [htmlWebpackPlugin],
    resolve: {
        extensions: [".js", ".jsx"]
    },
    devServer: {
        port: 3001
    }
};

Let me explain what this file is doing:

First, it is using the HtmlWebpackPlugin to create an HTML file to serve my webpack bundle.

Next it is exporting the plugin I created as a node module.

It is saying that the entry point of my plugin is in the location demo/src/index.js. This means that this is where the code to be exported will be taken from.

Next, it is saying that the output directory of my plugin is demo/dist. In this directory, the react-fcctest plugin will be exported in a file named bundle.js.

Next it introduces a set of rules for the file that is to be exported.

The rules, tell the file to do two things. One, use babel-loader when working with .js and .jsx files and do not include the node_modules folder. Two, use style-loader and css-loader when working with .css files.

The resolve and extensions part of the file allowed me to leave of the .js and .jsx from the end of my files while importing them.

Lastly, my development server was on port 3001. This port could have been any other of my choosing.

I just noticed that beauty involves hard work…

I added Webpack to the project on Sunday, and then the plugin worked!

With this, I was able to create a module that could be easily exported. This module was ReactFCCtest.

I cannot say how much the read-search-ask methodology helped me throughout the project.

Here is Demo of the finished plugin. It was very fun to build.

I tested it out in a freeCodeCamp project, and it worked perfectly.

_Credit: [https://giphy.com](https://giphy.com/" rel="noopener" target="blank" title=")

I created a Github Repository that holds all the open source code for the project.

How to install and use react-fcctest

Run npm i react-fcctest or yarn add react-fcctest to install the React plugin.

Place import ReactFCCtest from 'react-fcctest'; in your App.js:

import React, { Component } from 'react';
import ReactFCCtest from 'react-fcctest';

class App extends Component {
  render() {
    return (
      <div>
        <ReactFCCtest />
      </div>
    );
  }
};

export default App;

That is all there is to it!

Final notes

My 2018 so far has been amazing.

I am now the Developer Student Club Lead for my university, in a program powered by Google Developers in Sub-Saharan Africa.

I am aiming for greatness, in outer space — perhaps I might just land on a moon. Follow me on my journey.

In the autumn of 2014, I started my adventure into the world of DevOps. Having just started my degree, I found a society at the university that was in desperate need of some IT love. My home for the next three years was at Warwick Student Cinema.

Over the course of my degree, I tore every part of the cinema’s infrastructure apart and rebuilt it from scratch (not all single-handed, mind). Being on a tight budget, approximately £0 annually, the cinema’s infrastructure consisted of a number of hand-me-down machines that the university no longer required and a couple of 1U Dell pizza boxes they bought as a one-off expense. On this, they hosted their public facing website, as well as a number of internal sites crucial to the running of the cinema.

The most important of these sites was known as EPOS. It was a PHP monolith, intertwined with the main public website that was written about 10 years prior by a handful of enthusiastic students and had been passed over year on year to the next IT officer in line.

This EPOS site was used to sell tickets for the cinema’s screenings approximately 7 times a week. At each screening, over a 30-minute window, we could sell up to 300 tickets. But, more often than not, the site would fall over and our duty managers would have to resort to using raffle tickets to count our attendees. Sadly, the systems had no redundancy, nothing horizontally scaled, and honestly, no one quite knew how anything pieced together.

I’d like to think that by the time I handed the IT Officer hat over to my successor, the infrastructure was in a better state. All of the Linux workloads had been migrated to Docker containers, running on a Swarm. The container’s Dockerfiles were under source control, with automated builds and deploys using Jenkins.

We now understood the role of each part of the infrastructure, we could see in code what was running and where. The monolith could now horizontally scale and its up-time had greatly increased. I felt like myself and the few colleagues who helped me during this period had really made a difference to the systems we maintained.

Nice story Joel, but what has this got to do with community?

None of what I’ve described above I could have done alone. I’m no genius. I didn’t just instantly know how to write a Dockerfile, or how to set up a Docker Swarm. The redundant firewalls I set up with complicated policy-based routing and VRRP on their internal and external interfaces, it wasn’t guesswork. I barely knew what Linux was when I started university!

Everything I did, everything I learned during this period, came from the internet, the community. I spent countless hours on Google — going from tutorials on topics such as how to generate a CSR to StackOverflow questions which matched the error string I had just encountered. I trawled support forums for pfSense as I tried to work out how to get traffic routing between multiple VLANs. And I read articles on best practices for reducing single points of failures. All of the answers I found, everything I read, had been contributed by people in their spare time.

The community inspired me. There were so many people out there who were willing to give up their time, to share their expertise, to help people by writing, maintaining and responding to issues on open source projects. I feel like I learned so much over the three year period and I genuinely believe I wouldn’t be in my current role without all this. I feel indebted to the community for helping me to get to where I am today.

So the community got you where you are today?

That’s exactly what I’m saying! Without the time and effort that countless members of the community spent on their blogs and tutorials, I would not have managed most of the projects I took on at the cinema, nor would I have learned so much!

It got me thinking. I wanted to be able to give back, take what I had learned and become an active member of the community. If these people were helping me so much, could I possibly help them and repay the favor?

I came to the conclusion that I might be doing some interesting things at the cinema. Perhaps I had spent enough time learning from others that now I could start contributing back to the community. I bought myself a personal domain and decided that I would start blogging, with the hope that someday people might find my ramblings useful.

This didn’t go quite as planned. It took me a full 3 years from purchasing my domain to actually putting a blog up on it. I’m fortunate that my company, Pusher, is supportive of my wanting to write and to give back to the community. In March of this year, I managed to write my first blog post and have now been published on The New Stack, and InfoQ. I’ve spoken at 2 meetups and I’ve been pushing to open-source a bunch of projects I’ve worked on since I joined Pusher. Five have been shared so far!

What I have come to realize over the last year is that it’s not as hard to contribute to the community as I thought it would be, and that actually, I have been working on some interesting stuff. I’ve had a number of people reach out to me, talk to me after talks, asking me questions or for more detail on the work I’ve done. A couple of times people have just told me they’ve read my work and used it as a guideline for their own projects. I’m glad I have managed to help these people and started to help others as many others helped me.

Why Open Source your work?

The projects we’ve open sourced at Pusher aren’t particularly big and they give us no competitive advantage over any of our competitors. They are related to our Kubernetes infrastructure. Where we couldn’t find an existing solution in the community, we wrote the tools we needed, and now we are sharing them so that other people, trying to solve the same problems, need not spend their time writing their own version.

Perhaps you’ve worked on something that is similar, is it open source? Could it be? I would like to encourage you to share it if you can.

My plea

If you got this far, thank you, I have a favor to ask. Whether you’re a developer or an accountant, whether you work in PR or in Sales, you will know something that someone else doesn’t. You will be an expert at something even if you don’t know that you are. Have a think on that and then put pen to paper (or digital equivalent).

Write an article and share your experience. Write an article and help someone learn, and further themselves. Help them understand something they’ve been trying to wrap their head around for days. Write an article and, like so many did for me, inspire someone.

In the city of Warri, Delta state of Nigeria, there is a saying that goes “Warri nor dey carry last, if e hard well well na draw”. This translates to “Warri is never behind in the scheme of things (events)”.

Not oblivious to the fact that technology is changing the course of events across cities, nations, and the world, a group of tech enthusiasts (code named Warri Tech Network), led by Paul Okoro, organized the Warri Tech Awareness week 2018, #wataw18.

The Warri Tech Network is driven by the cardinal goals of:

1. Developing a vibrant tech ecosystem in the city.

2. Exposing the technological solutions from Warri to the world.

3. Inspiring the youths in Warri to make career choices in tech, like becoming software developers.

4. Encouraging the adoption of technology in the city and the state through collaborations with the Delta state government.

Armed with these goals, they embarked on a week-long awareness campaign. The campaign, which began on January 29, 2018, came to a climax on February 3, 2018 with a summit — The Warri Tech Event.

During the course of the week, the team organized sensitization campaigns like paying visits to a radio station, some business owners, and an interactive session with college students of the Petroleum Training Institute, Effurun, Delta state.

Saturday, February 3, 2018 — the Warri Tech Awareness event

A tech awareness event with an attendance of over 50 persons cut across college students, software developers, and a representation from the Delta state government was exciting and inspiring.

It was especially inspiring to have a representative of the commissioner for science and technology deliver the keynote address.

The panel session on Creating a Tech-Enabling Environment in Warri gives credence to the fact that there are seasoned professionals in every city. For instance, I got to meet one of the panelists, Omawumi Eyekpimi, an Android developer and writer based in Warri.

_L-R [Victor Otaigho](https://twitter.com/LeBelleAmi" rel="noopener" target="_blank" title="">Omawumi Eyekpimi Android Developer, Barr. Austin Ngwu, Benedicta Orioko, Tobore Adakaraza, <a href="https://twitter.com/votaigho" rel="noopener" target="blank" title=")

Key Takeaways

1. Setting up a tech community requires just a few passionate individuals who are willing to contribute their time and resources. And the rest will be history.
2. People are in search of knowledge and direction. If you have that knowledge, you can help them see further by allowing them to stand on your shoulders.
3. It turned out that Warri has some amazing software developers. I had an awesome time listening to them talk about their solutions during the technological product exhibition.

Learning to code is one of the major steps you’d take when switching into a career in technology. A vibrant tech community can help accelerate your growth. You can sign up with freeCodeCamp and start the journey to becoming a web developer.

You can join the freeCodeCamp Warri study group. I created this group some time ago, and I look forward to having coffee with campers who are in Warri.

Follow the twitter handle of Warri Tech Network and be a part of the birthing of a tech ecosystem in Warri. You can also reach out to Paul Okoro and Omawumi Eyekpimi.

Here is a link to the photos from the event.

Does any of the following sound familiar?

You constantly worry that you are not good enough.

Look at the developers around you. They seem to have everything together. Their code is cleaner than yours. They debug much faster than you do. They merely glance at documentation before knowing what they need. They are confident. They enjoy coding.

But you, you are worried. You worry that you don’t know enough about the framework and the language you are using. You worry about introducing bugs. You worry about catching up with the hottest technologies. You worry that you are not talented enough. Things don’t come naturally to you. You think to yourself: “Maybe I’m not meant to be a developer.”

If any of these self-doubting thoughts sounds familiar to you, you are not alone. Google “self-doubt developers”, and you will find over 2 million results in less than a second.

I was you.

For a period of time, I also experienced intense self-doubt, wondering if I would ever “make it”. It happened in college when I was practicing and preparing for job interviews. Each day, those algorithm problems made me feel like a complete failure. I was stressed and worried, as much as you might be now.

Eventually, my practice paid off and I received multiple job offers from prestigious tech companies. Along the way, I learnt two important lessons that changed my view of programming and eliminated my self-doubting thoughts. I’m sharing them with you now. Hopefully, they help.

Lesson #1: Learning programming is exactly the same as building muscles

To learn to play soccer, you need to go to the field and play. To build stronger muscles, you need to go to the gym and lift those weights. To learn programming, you need to sit down and code.

After lifting weights, you will feel sore and tired the next day. When stuck on a programming problem, your brain will (literally) hurt and you will get frustrated.

You won’t give up working out simply because of feeling sore. You know it’s part of the process. But when you get stuck while programming, you might start doubting yourself, wondering if you are talented enough. Because: (1) you think getting stuck is your fault, (2) others make it seemed effortless.

1. Getting stuck is part of the process.

Maybe no one has told you that, but it’s absolutely normal to get stuck during programming. It happens even to senior developers. A big part of programming is about figuring out why what you expected to happen didn’t happen. If you agree that expecting a child to be able to walk the first time he or she stands up is absurd, why would you expect the first draft of your code to run perfectly without any bugs?

I remember times when I got stuck for so long that I wanted to bang my head against a wall. I know it’s hard and frustrating (especially when dealing with issues related to dev environments). But hang in there. Dig into the issue. Ask Google. Ask a friend. Take a walk. You will eventually solve it and move on. And as you gain more experience, you will gradually get stuck less.

Next time you get stuck, don’t give yourself a hard time. Remind yourself it’s not your fault. It’s normal. It’s part of the process.

PS — Setting up a dev environment might be the most difficult part of programming.

It’s very common to get stuck and spend days on setting up a development environment. These are moments that might crush your soul. You try to follow the instructions step by step. But random errors keep showing up in every single step. The instructions make it seem easy, but it’s not. It’s not your fault getting stuck. 99.99% of the people reading that tutorial get stuck. The remaining 0.01% are the lucky ones who happen to have the exact same operating system setup as the instructor.

It’s unfortunate that the first step of learning to program is also the most frustrating and soul-crushing part. When you see errors you can’t understand, just copy the exact error message and Google it. (Putting quotes around the error message or just search the first half of the message might help.) Try different solutions until you find the one that works. And move on.

Pardon me for repeating: getting stuck at this stage is not your fault. We ALL do. And I promise programming will become a lot more fun once you get past this stage.

2. We confuse “genetically smart” with “appeared smart because the person has spent tons of time on related subjects”

During my last semester in college, my friends were amazed by how well I did in the Advanced Data Structures & Algorithms class. I made it seem effortless while they were struggling.

What they didn’t know was that months before the class, to prepare for interviews, I had spent countless hours practicing coding challenges, which covered the exact same topics as the class: dynamic programming, depth-first search, breadth-first search, etc. It appeared effortless only because I had already been through these struggles.

When I first self-taught these concepts, I would spend hours staring at a problem and couldn’t figure it out. When I gave up and looked up solutions online, I struggled to understand them. When I finally did, I felt even more frustrated because I doubted I would ever be smart enough to come up with such a solution myself.

Sometimes even when I encountered the exact same problem again, I might’ve still had no clue on how to approach it. I would get so stressed that I had to take long hot showers to calm myself down.

So believe me when I say that I know how it feels to doubt yourself and worry that you can’t make it. I have been there before. And I can assure you that you are not alone. Many great developers have been through the same thing. (Here is a podcast about this topic.)

Next time you are struggling while people around you are excelling, don’t think it’s because you are not talented enough. Most likely, they just have more exposure to the subject, or similar subjects, than you. Their brains have built up the “muscles” to handle this type of subject. After you get through your current struggles, you will appear smart and effortless as well.

It’s all about reps and sets.

You build muscles by exercising them. The more effort you put in, the longer you train, the stronger you become. Learning programming has the exact same process. The more time you spend coding, the more proficient you will be. You reap what you sow.

Lesson #2: Focus on your craft, not you

Stop thinking about how good or how bad of a programmer you are. If you are in the bottom 5% of your team, you want to get better. If you are in the top 5%, you still want to get better. No matter how good or bad you are, there are always people in front of you and people behind you. So why waste time thinking about it?

Instead, focus on your craft. Stop asking how good you are. Ask how good your code is. How can you make it better, faster, more readable? Surround yourself with engineers you admire. Read their code. How is it different than yours? What are the trade-offs they are making?

If you already work as a software engineer, someone is paying you to write code. You should pause and reflect on it, as it means a lot: someone either believes in your coding skill or sees your potential. The only way to live up to that potential is to focus on your craft and improve it relentlessly.

Action Item: Start keeping track of small wins

When was the last time you got stuck and weren’t sure if you could solve the problem? How did you eventually solve it?

Open a new Google Doc and write it down.

Next time you doubt yourself, take a look at the doc and remind yourself: if you could solve that last problem, you will solve this one as well.

Use the doc to keep track of challenging problems you overcame and what you learned from them. Always, always celebrate these small wins!

Leave a comment and share the last time you got stuck to remind those who are currently struggling that they are not alone. ?

Want to read about my career in tech? Check out my other articles.

Have other questions related to programming?

Please shoot me an email: sihui@sihui.io