How to become a software engineer in South Africa? Learn React.

How to become a software engineer in South Africa? Learn React.

What Is a Front-end Developer?

Have you ever wondered how to become a software engineer in South Africa? Front-end Software developers are a desired commodity in this country, as they are responsible for building the parts of a website with which a user visually interacts. Back-end developers focus on providing the data and services required by the front-end. For example, the posts on your Facebook home page will have been designed by a front-end engineer, but the back-end developer ensures you receive the data populating those posts.

Of course in the work environment, often this distinction may become unclear. However, it is generally accepted that the bread and butter of front-end development is html, css and javascript. A solid of understanding of these three technologies is essential before attempting more advanced frameworks.

The Framework Fight

The MDN Web Docs—a valuable resource for any web developer—defines a framework as the “tools and libraries to simplify common web development operations”. The current major three frameworks are React (developed by Facebook), Angular (developed by Google) and Vue. The following chart shows each of these framework’s downloads over the last five years. Although npm downloads are not a perfect measure of popularity, the chart does illustrate the meteoric rise of React.

Available: https://www.npmtrends.com/react-vs-vue-vs-@angular/core

However, in a South African context, Angular finds itself leading the pack. In the 2019 State of South Africa’s Software Developer Nation by OfferZen, Angular and .NET Core both lead React. Again, this survey design is not without its flaws, but does show that Angular is also a great choice for securing a job locally. A quick look at Linkedin shows 860 results in the last month for jobs compared to 440 for React.

Why React?

If Angular is so popular in the front-end development scene in South Africa, why learn React? The first reason is South Africa tends to lag behind the international community by a couple of years. In the coming years, the local tech industry is likely to see growth in React job opportunities at the expense of current Angular positions. This would be caused by companies trying to adopt international trends. The second reason is that Angular uses TypeScript which makes the learning curve slightly steeper than React for anyone just starting out. That said, learning Angular does offers a developer ample opportunities.

Learning Resources

The web is littered with ways to learn to code, which allows anyone with the passion to learn the craft. The following are a few of our favourite online sources. Brad Traversy’s React course on Udemy teaches through building real world examples. One benefit is that he will cover the nitty gritty parts of setting up your project. He then allows you to build on top of his example—an excellent way to come to grips with any programming language. Another great resource is Dan Abramov’s introduction to JavaScript. Consider following him on twitter too @dan_abramov.

‍

Create-React-App

For the impatient, you can use create-react-app to set up a boilerplate project within a couple of minutes.

1. Install npm if you have not done so by going to this link.
2. Create a project folder on your computer. Then navigate to this folder on the terminal by typing cd and dragging and dropping the folder onto the terminal application or copying the file path to the folder.
3. Run  npx create-react-app my-app
4. Then cd into my-app by running cd my-app
5. Finally, enter npm start and a browser window should open displaying your boiler-plate application.

From here, go to the App.js file to start making edits.

Deploy to Heroku

Deploying on Heroku allows you to send your application to anyone.

1. To start with, make a free account on Heroku.
2. In terminal, type git init
3. Type git add .  followed by git commit -m “my first commit”
4. Type heroku create my-app –buildpack mars/create-react-app
5. Git push heroku master
6. Heroku open
7. And…you’re done!

Anytime you want to update your Heroku application, simply follow steps 3 and 5.

Conclusion

To sum it up, learning React or Angular opens up many opportunities for any aspiring developer.

‍