You know, the best part about being a front-end developer or studying front-end development is that you can start at any point in your life and for any given time frame. YEAH! I mean, it doesn’t matter what your previous knowledge of code is; even a construction worker with a stable internet connection can do it.
To become a front-end developer, you must master the three basic building blocks of what you see when you visit a website or open an app, namely HTML5, CSS, and Javascript. Yeah, of course, the framework that suits you the best. After learning all these languages, which should take approx a month or maybe 20 days if you are desperate, it’s just practice and working on projects.
Easy guide to front-end development:
There’s not. Yes, you read that right. There is no such thing as an ‘easy guide to becoming a front-end dev.’ Believe me. Things could get no more accessible than learning HTML, CSS, and JS, for once you start, you are so into it just by the feel of it. It looks easy to code and assembles. But, with a code editor of your choice, it is next to doing something productive rather than being depressed all day in your room.
Where to start from/How?
- The best source for finding the study material for the languages is from the internet, mainly youtube. It has tons of videos and self-learning websites-made playlists full of videos related to the topic you want to learn about. Some of them being CodeWithMosh1 and freeCodeCamp2, have videos with extensive audience interactions throughout the course.
- Be careful on Youtube because you can waste your time on crappy tutorials, so if you can afford it, always go for paid resources like Udemy3 and Coursera4, which have tons of helpful content with a variety of certified teachers often backed by universities that can help you move to your destination a bit faster and smoother.
- If you are a fan of written content and going through stuff by yourself, there is just the content for you: the MDN documentation5(Mozilla developer’s network); it’s free.
- There are self-learning websites, too, like GeeksforGeeks6 and w3schools7 that move at your pace and are designed from the basic level so that one can navigate his journey to the end with topics arranged in an immaculate and specific manner.
- Learn and curate layouts, flexboxes, grid boxes. Practice all you can do.
- And most importantly, START NOW!.
Why front-end?
It is an outstanding career financially. For example, the data at www.glassdoor.com shows that a median salary of a front-end developer can go from 56k a year to as high as 80k.
- Plus, you get to work on many different levels like designing, typography, UX, colors; hell, you even get to interact on the client-side of the applications.
- You can unleash your creative side. It will result in some of the best management platforms for the site or application using hot new tools like CMS(content management systems) and bootstrap.
- There is exponential room for growth as it is easier to get into. Still a bit harder(i would say) to master, so you get to learn from your seniors and other open projects.
- This is the best time to be a front-end developer because if you invest your 100% into it, the payoffs are well worth it. Also, there is a high demand for good front-end web developers because a lot of work that used to be done ‘purely’ by the back-end is now done by the front-end.
What it takes/ the process :
- Find
Look for new technologies as there is a new one emerging every day. Get a bird’s eye view of the industry as a whole and know all the players in the game.
Understand the basics of computer science like taking the HarvardCS508 lectures on Youtube, and things like what an HTTP is, the server-side, a client, their relationship, etc.
- Learn and build
Learn from various micro-projects, build your applications, forms, navbars, and chisel the basics. Then, lookup for tutorials for making some stuff related to your topic and start doing it. Eventually, you will move onto more significant projects like building an eCommerce site like Amazon or an online forum site like re4ddit. Here more significance doesn’t mean complexity or the number of pages; one can also start by making clones of the websites mentioned above.
- Repeat
Don’t procrastinate but code. Take breaks and take it slow.
What’s new in 2021?
- Learning only the languages is not the way to tell if you have mastered them or not; it will take a lot of work. The point is to build more than learning.
- Spend about 100hrs building projects with pure HTML/CSS.
- Don’t be the nerd who chugs the whole book before the exam, be the intelligent worker and learn git and git-hub, which is another resource[a version control system] that may help you connect and at the same time add value to your/other person’s code.
- “Everything that can do in javascript will be done in javascript” -some random yet excellent developer on the net. Give equal importance to javascript as it can be helpful for logic, functionality, games, etc.
- Make your algorithm strong. It can help you think like a programmer and build your logic faster and with ease.
- More significantly, when you are done with the things mentioned above, you can move on to design patterns and frameworks like ReactNative and Flutter. There is a reason why frameworks exist. Know the WHY.
- A javascript code with a “.js” extension can only be run and understood by your browser so learn NodeJS9. It is not a framework or a library; instead, it’s just a runtime environment that makes sure you can write javascript outside of your browser(like iPad, phone, robots, machinery) and much more.
- Learn how to build APIs(application programming interface).
Is the job-ready?
- Have a beautiful yet straightforward portfolio?. Don’t tell me. Show me.
- Visit different sites/portfolios like:www.rouserlab.com, www.brunosimon.com and see for yourself how creative people can be.
- If possible, document your journey and start writing blogs.
- Case studies of one or two of your projects, where you talked about what you learned, the obstacles, things you tried, etc.
- You can also freelance at platforms like Fiverr and Upwork and charge hourly rates according to your experience, but don’t run after money initially, acquire expertise and add to your resume.
- Go on LinkedIn, network with communities and people in your field, and apply to at least five jobs per day.
- Most people don’t try hard enough. Also, be ready to move to a different location.
- Don’t worry about qualifying; still, apply if it’s somewhat similar. You will learn quickly. It takes only one job, and once you are in the game, the following jobs will be easy as hell.
- Learn SASS and WordPress.
- Learn a new language like python and c++ once you are placed or have a job.
Conclusion
I have articulated whatever I knew and gathered from the net; everything you need to know is in there; make sure you don’t quit. You can’t find a solution to a problem. Fall in love with pain. Go through dozens of resources until you find your way. You don’t have to be wise; you have to stay with the problem a little longer, and eventually, the right thing clicks. Then, at last, polish your understanding of the front-end and don’t mind learning new things.
Pro-tip: You are going to need a lot of coffee, and remember to get enough sleep.
FAQ:
Q1. How much time takes to be a front-end developer?
Ans. Although you can learn everything in almost two months, you cannot become a full-fledged front-end master. Even with boot camps, people take 4-5 months after learning all the languages.
Q2. How to apply for a dream job?
Ans. Select three to five companies you want to work for. Profile them and their needs. Be more personal and see how you stand out and what you can grasp from them.
Q3. Which code editor and framework is the best for front-end development?
Ans. I use vscode as a code editor, but others like sublime and your simple dev tools in your browsers can also help. Talking about frameworks, there is no “best.” Stop debating and start building stuff once you learn one well. Then, it’s done for good. Although I would recommend, ReactNative be of cause “More .” mand.”
Q4. What is a CMS?
Ans. A content management system (CMS) enables end-users to create and manage content on a website. They are designed to make content management easy for non-technical users. One of the more significant, critical features of the sound content management system is that no coding is needed to create or modify c fort for ex- WordPress and Wix.
