A Beginner Path To Becoming A FrontEnd Web Developer

·

7 min read

Thank you for joining the community of developers.

The road you are about to take is NOT easy, but you have what it takes to succeed in it. Do not think that you will learn everything in just a few months or within a year. Learning web development and programming is a gradual process yet requires consistency. Remember,

the sun does not burn until when brought focus. Alexander Graham Bell.

Below is the list of materials you need to get started.

Note that they are not all you need, but it will serve as an entry point to attract others.

image-tools.jpg

TOOLS

  • A Laptop. Of course, you can read up documentation with your phone even practice writing few codes. The truth is you are limited to what you can do. Therefore, I recommend that you have a working laptop and a strong internet connection because most of the things you will learn are online.
  • A Browser. Without much emphasis on this, I recommend you use the latest version of chrome. Download it Here
  • A Code Editor. A code editor is where you write your JavaScript CSS HTML codes and much more. I recommend Visual Studio Code. It is the most used by developers. You can download it Here
  • A Version Control System. Save and track changes made to your code. Share your code with other developers. Have access to the codes written by other developers. Work together on a project from different places and platforms. For all these mentioned and more, I recommend GitHub. I will introduce you to how you will get started with Git in another course. You can get the download link to Git Here
  • Javascript Runtime Environment. Node.js is a javascript runtime environment that allows you to write your javascript code outside of the browser. Npm comes alongside Node.js. When you download Node.js, you have downloaded npm. Npm makes it possible for javascript code sharing. You will need npm when you start working with libraries and frameworks. You can download it Here

LANGUAGES

  • HTML. It is a markup language that allows you to bring elements into the browser. Elements can be text, images, videos, forms, tables, etc. I will recommend starting with the w3c documentation about HTML.
  • CSS means a cascading stylesheet. It allows you to style whatever you have brought into your browser. View the web as a white and black document without CSS. I recommend w3schools for learning the core CSS. With time, you may also want to use CSS frameworks for easy workflow. I will recommend Tailwindcss for that.
  • JavaScript. It is a programming language. It is a powerful tool that allows you to add functionality to your web pages. The more you learn javascript, the better you become in website development. I also recommend MDN documentation and Javascript Grammer for this.
  • REACT is a javascript library that allows you to leverage all the web development tools you have learned to build an interactive user interface. A good understanding of the 3-languages aforementioned will help you to use React better. React is very broad. I recommend you to read the official react documentation to gain an insight into what it is.

SOCIALIZATION

Yes, developers love to be themselves. Learning inside closed doors will help you but not more than when you connect with people who have taken the same path you want to take now. Therefore I recommend that you align with developers on Twitter. You will also get updates on web development, internships, and jobs.

CODING CHALLENGES

You may never feel like learning unless you create something out of what you have learned.

  • Frontendmentors is a better place to start with once you have finished learning your HTML and CSS added with little JAVASCRIPT. They have well-aligned resources that will help you master the use of HTML and CSS. You can also build your projects. Learn more about what frontendmentors offers you Here
  • CodeWars and Hackerrank are also better places to test the level of your programming. Codewars gives you the ability to see varieties of codes that does the same thing. It will help you to learn a pattern and best practices in programming. Hackarank is much more advanced.

COMMUNITIES

  • Freecodecamp is a better community to join while learning. They have provided all the lessons and challenges you need to start. Join Freecodecamp from Here You may also want to check out Google Africa Developer Scholarship (GADS) program for young African Developers.

BONUSES

Always google out your questions and challenges to the world. Stackoverflow and developers' blogs will always come to your rescue. Reach out for a mentor if you can. They will keep you motivated.

Happy Learning!