How to become a Front-End Developer: Part 1

UpdatedNovember 18, 2024

I am Nandan, And you probably know me as a "Software Engineer who "hacked" an Airline to retrieve his luggage".

I am a full-time Software Engineer, Tech Speaker, and mentor. I enjoy talking about Web Development, Machine Learning, Natural language Processing, Machine learning Accelerated Mobile Pages, Progressive Web Apps, Cybersecurity, Chatbots, etc.

My claim to fame was when I posted a series of tweets on Twitter about data privacy issues on an airline’s website and the tweet got viral for all the good reasons. The story was covered by all major media portals all around the world including BBC, Saudi Gazette, Times of India, Boing Boing, Lallantop etc. and I have been interviewed by some major radio channels and podcasts.

In my free time, I like to indulge myself in activities like Photography, Gardening, Snooker, or Boxing. I am a proud owner of many plants, I sometimes talk to them (mostly pep talks).

Comments

Join the discussion

No comments yet. Be the first to comment.

Front End - HTML, CSS & Javascript

Part 1 of 10

In this series, I will write about Front End Technologies, Including mini notes of my learning along the way. Follow to keep updated.

Up next

Design Patterns: Module Design Pattern in JavaScript

Module Design Pattern is a way to encapsulate and organize code in a self-containing module that can expose certain functionalities while keeping the rest of the code private. This helps prevent variable and function name clashes, improves code maint...

More from this blog

How I Moved My Google AI Studio App to GitHub CI

Three wrong Fixes, one ghost container, and an afternoon I did not plan for.

Jul 12, 20266 min read179

How I Moved My Google AI Studio App to GitHub CI

I Got Tired of Goodreads. So I Built Kitaaben.com

I read a lot. Not as much as I'd like to, but enough that I needed a place to keep track of it all. For years, Goodreads was that place. Then Amazon bought it in 2013 and... nothing happened. No meani

Jun 24, 20264 min read22

I Got Tired of Goodreads. So I Built Kitaaben.com

How to Convert Nested Objects to Flat Objects in JavaScript.

Why Arrays Need Special Handling.

Mar 4, 20264 min read55

How to Convert Nested Objects to Flat Objects in JavaScript.

HTML Pitfalls and Gotchas Every Developer Should Avoid

HTML is Easy, May be Not.

Sep 5, 20254 min read38

HTML Pitfalls and Gotchas Every Developer Should Avoid

Front-End Developer Interviews: The Crucial Aspect of Accessibility

What you should know about Accessibility.

Aug 9, 20253 min read49

Front-End Developer Interviews: The Crucial Aspect of Accessibility

Nandan Kumar's Blog | Software Engineer | Featured on BBC, Saudi Gazette, Times Of India | Tech Speaker | Mentor

38 posts

Software Engineer | Blogger | Tech Speaker | Mentor | Featured on BBC, Saudi Gazette, Times Of India

When I started my career as a web developer, a few years back, it was not so much of an easy start. There were very few learning platforms and fewer boot camps; But What was there and is still present, A community that believes in sharing knowledge and that's one reason the web community is growing every day and will keep on growing.

There are many courses free and paid available on the internet, I will share what worked best for me and also does not burn a hole in your pocket; also I am not a big fan of certifications, So it all will be more of hands-on

Let's get started then :

Start with HTML / CSS / JavaScript basics on W3Schools , I still re-visit w3school to learn about something new. Once you know the basics, start making clones of websites like Twitter using HTML+CSS only. Get good at it.
Head to MDN web docs for leveling up developer.mozilla.org and deep dive into concepts of HTML and CSS. Don't look at their JavaScript docs yet. MDN's JavaScript docs are a bit detailed and can be overwhelming.
Go to javascript.info for a detailed overview of JavaScript, It helps you understand the basics well and has a good collection of concepts.
It's time you start building some functional websites. Get familiar with NodeJs and NPM modules. Start adding click events etc. on that Twitter clone you built. maybe start adding a JSON DB in your local. There are some NPM modules like json-server that can add a JSON dB in your local dev environment.
Once you are done with http://javscript.info, get back to MDN JavaScript docs and get a detailed understanding of essential concepts.
Keep building more and more websites. If you are not familiar with some concepts get to YouTube and learn, there is a lot of free content available.
You can pick a framework/library of your choice like Angular/React/Vue if you want to scale up. It's completely a personal choice, no one framework is best, learn what suits you. Start with the official documentation. I will cover more on this one in my next post in this series.

P.S.: The post is picked up from a series of tweets I made a few days back. Do Check it out :

https://twitter.com/_sirius93_/status/1522448208533725184?s=20&t=jE7z63yTcpg6u8JZnF009w

Feel free to add your thoughts in the comments section below.

Command Palette

Comments

Front End - HTML, CSS & Javascript

Design Patterns: Module Design Pattern in JavaScript

More from this blog