How can I start my journey as a frontend developer ?.

Have you been looking for a way to get into tech from other fields or want to sharpen your Frontend development? Well, I’m here to offer a guide to make it easier. Oh no, not easier but make it better and definitely going to be fun too. I will be sharing few resources and tutorials which are going to be useful on the run. So let’s get started.

Firstly, what comes to your mind when you hear frontend development? well, this is just the development of the graphical interface of a website. When you open your browser and search for a website, all the what is displayed like header, menu, buttons, images, slideshows, etc. All these amazing and appealing designs are made by Frontend developers to provide great interaction and navigation between the users/visitors with the website.

To make interactive designs like that, you need proficient knowledge in HTML, CSS, and Javascript
Oops! This is much, where do I start learning all these three Languages?.

Well, HTML is just a markup Language while CSS is a style sheet basically for styling. Javascript is the only Kick in the ass, programming among them but when you understand the way, it is going to be easy and fun as stated earlier. So Let’s start with HTML and CSS to build a beautiful website.

You need to have an editor installed on your device or still choose any of the editors on the lists below to download before we start proceeding to the next Phase

Vscode Download here

Atom download link

Sublime text download link

Nodepad++ download here

Kindly follow the guide on the editor you prefer and download it on your system.
Phase One
HTML : Hypertext Markup Lamguage.
This is the standard markup language for documents designed to display on the web browser and is supported by CSS (Cascading Stylesheet ).

Video Format :
• Brad Traversy
• Net ninja
• CS50
• Pluralsight
Text Format Learning :
• Educative.io
• Freedcodecamp
• Codeacademy
• Khanacademy
Top resources: Paid version
• Udemy
• Coursera
• Educative.io

Learning HTML and CSS can roughly take 3-6weeks to be mastered by spending at least four hours on it daily. By the end of the fourth week, you should be able to design the following correctly’

• Login and Sign up page
• Landing page for business
• Basic components on the page such as slideshow etc

You can level up your design knowledge by building few designs on codepen , check out the following designs done with HTML and CSS.

Now let’s proceed to Phase 2 : Javascript
Javascript is used to improve the interactivity of the website and help to implement complex features on the web pages, instead of just displaying a static content, it helps in provide time information updates, animations, maps etc.

Kindly check out the following resources to improve your fundamental knowledge on javascript

Resources:

EJ Media

Traversy media javascript

freecodecamp

Khan academy

Few projects ideas to boost your understanding and learning process

BMI Calculator

To-do list

Contact App

Currency Converter

Image slider

Counter App

Color Generator

Birthday Reminder

You can search for interesting vanilla javascript projects.
Learning vanilla javascript and having solid knowledge on it will ease your progress when you start learning any javascript MVC framework like React, Angular, Vue etc.

Kindly take enough time building projects that you can, every big projects you see today started with hello world.

Keep learning !!!

Thanks for Reading.