So you want a new career in something that you will love? Perhaps you’ve dabbled with code but never taken it to the next level? Or maybe you are good with computers but became too comfortable with your retail job?
Whatever your reason for wanting to learn web development, these 9 steps will help you replicate my success from when I went from working in a hardware store, to being a senior developer at an established company.
Tip 1: Discover how you best take in knowledge
This is the most important tip on this list. You may already have a good idea about how you best learn a new skill - but if you don’t, then my suggestion would be to experiment.
You may prefer following written tutorials or perhaps you like to start a project and get hands on. Alternatively, if you are like me, then you may prefer to follow video tutorials.
The main point here is to make sure you understand how you take in information more efficiently and prioritise absorbing that type of content.
Tip 2: HTML first and get a solid knowledge foundation
Before you learn front end web development, take the time to understand the basics. HTML is where you should start. If you think of a web page as a body then the HTML would be a skeleton - the parts that hold everything together.
Below is an essential checklist of the concepts that you should strive to understand.
- The structure of a standard web page and the tags used to create it
- Basic tags and what they are used for. For example,
<div>,<h1>,<img>,<p>and<span> - HMTL5 semantic tags such as
<section>and<article>and where and when to use them - How to link to external resources such as style sheets and JavaScript files
Two great HTML learning resources:
Tip 3: Learn CSS next
CSS is next in line. Going back to the body analogy, CSS would be the skin and determines the look and feel of the web page.
What you should seek to understand:
- Understand how styles cascade down
- The basic syntax of writing CSS rules
- How to reference classes, id’s and tags
- Differences between block and inline elements
Two great CSS learning resources:
Tip 4: Get consistent with your HTML and CSS skills
Code, code, and code more! Build beautiful web pages and projects - even if they will never be real websites.
The aim here is to put yourself in scenarios where you have to learn new skills in CSS or HTML to accomplish your goal. Practice really makes perfect!
One important point here is not to worry about any additional functionality that may require JavaScript (the brains of the body). Just focus on building out the look and feel.
- Build out a custom website on a topic that you are passionate about
- Take an existing website and replicate it with your own code
- Follow a code-along video and pause in parts to do things on your own
Tip 5: Don’t worry about JavaScript (yet)
Although JavaScript is one of the three pillars of basic web development (along with HTML and CSS), some would argue that it is also the hardest to learn. The beauty is that you do not need to know JavaScript to build a website.
Many other resources and tutorials may tell you to learn JavaScript prematurely. My advice would be to leave JavaScript alone until you are comfortable writing HTML and CSS.
Also, don’t worry about react, angular, bootstrap or anything else. That will come later.
Tip 6: Work on websites and projects that interest you
Let's be honest, you aren’t going to be motivated to learn web development unless you have an interest in what you are creating.
Ask yourself, what are your interests?
Do you enjoy gaming? If so, then build a replica of your favourite game's official website or create an information and tips site for your favourite shooter.
Tip 7: Do not buy any courses until you have a good foundation
You do not have to part with your hard-earned cash to learn the basics! There is so much free content on the internet these days, I would argue that you never need to buy a course to become a successful web developer.
That said, when setting out to learn something new, my first place to look is Udemy.com. The difference here is that I am usually looking for something a bit more advanced.
Once you have the basic skills down, then it may be time to look into paid content to learn more advanced concepts.
Tip 8: Don’t stress out about a personal website
When you get to the stage where you are looking to apply for jobs, you may be led to believe that you need a personal website to display your work.
Honestly, it is not a bad shout to have one, but it is definitely not compulsory.
All I had when I landed my first development job was a GitHub profile with a few repos and a head full of knowledge I had learned from around the internet.
Tip 9: Don’t give up and do not fear rejection
This last tip is crucial to your success. Chances are you will not land the first job you apply for. You will probably get rejected and rejection can be very deflating, however, you cannot let it get the better of you.
Learn from your experiences and touch up the areas you are weakest in. The right opportunity will come around if you keep at it!
Conclusion
Following these steps are sure to help you learn front end web development and it’s really up to you how quickly. It took me around 6 months of putting my head-down in my spare time to have the confidence and knowledge to apply for junior roles. Get tip #1 nailed before you continue to proceed to any code. Get consistent and remember tip #9, when the going gets tough.