4 answers
Asked
722 views
What is the best learning bath to be web developer?
Web development
Login to comment
4 answers
Updated
Venkat’s Answer
Web development mainly has two parts: frontend engineering and backend engineering. Then comes the full-stack that merges the two(though often most job responsibilities are mainly given to one end).
Often few students who get started, confuse web development with more design and HTML/css which it is not and it is more of a technical and logically challenging field with a lot more code.
Believe it or not, you might learn the below tools and tech in 3-6 months if you invest a good amount of time say 8-10hrs daily.
Join a web development BootCamp that is in-person and will give you a more collaborative environment or do the below:
Learning Path:
Frontend-
Git and Github: A version history of your code
HTML-CSS-Javascript : these are the fundamentals(don't just read, code)
Frontend design inspirations from dribble/Behance/Pinterest
Build Projects: Static websites and games with Javascript and put them in your git/GitHub
Wireframing and planning: Meanwhile you can also experiment and learn Figma/photoshop which can help in planning and designing how to build your website(optional)
learn what is npm and how to use it on basic level.
Design Libraries and Frameworks: Learn a few popular design libraries enhancing your CSS abilities - MaterialU, bootstrap, shadcn
SPA Frameworks: Finally understand what Single page applications are and delve into one of the following React/Angular/Vue/Svelte.(React being the popular)
Learn all about the framework you are working.
Learn Testing web applications.
Learn to build and package web applications.
Learn to deploy your app on any cloud platform in free tier and learn few different concepts on loadbalancer, content delivery network and others by assuming your application will be in used by realtime users and million visits per second.
Learn W3cag guidelines
Backend-
Learn one backend/server side language: you can go with javascript and typescript since you have already gone through with it.
Learn node.js
Learn express.js or any other framework for building web APIs
Learn the protocols and standards to work with web API - HTTP/REST/SOAP/JSON/XML/GRPC/Graphql
Learn one SQL and one NoSQL database.
Use postman
Learn testing on all the applications - Unit/Performance/Integration, etc
Learn about applications and web servers
Then deploy them on any cloud platform
Learn docker to ease out your development to the production process.
Build real-world web applications say- netflix, YouTube, amazon, etc. Do not try to build the whole feature set but take some small use cases and build over it for your portfolio. Collaborate with fellow developers to create few projects.
Meanwhile for interviews learn data structures and algorithms on leetcode/neetcode
The learning path I have provided can be overwhelming, but start with the basics and you will be good at it eventually. Focus on one area that you might tend to like more ie: frontend or backend.
Building projects is very important right from the very beginning, be it silly or redundant websites, it does not matter!
Popular resources to start:
w3schools.com
https://developer.mozilla.org/en-US/(once you get to intermediate level)
freecodeacademy YouTube channel free resource for every tech and path you want to take.
Join a network of people who are at your stage and starting and get mentorship from some senior developers by connecting them from LinkedIn who went through the same path that you are willing to take.
Create a LinkedIn, GitHub, and personal portfolio and update it regularly. Apply to internships and jobs one you are ready to go to next level.
Often few students who get started, confuse web development with more design and HTML/css which it is not and it is more of a technical and logically challenging field with a lot more code.
Believe it or not, you might learn the below tools and tech in 3-6 months if you invest a good amount of time say 8-10hrs daily.
Join a web development BootCamp that is in-person and will give you a more collaborative environment or do the below:
Learning Path:
Frontend-
Git and Github: A version history of your code
HTML-CSS-Javascript : these are the fundamentals(don't just read, code)
Frontend design inspirations from dribble/Behance/Pinterest
Build Projects: Static websites and games with Javascript and put them in your git/GitHub
Wireframing and planning: Meanwhile you can also experiment and learn Figma/photoshop which can help in planning and designing how to build your website(optional)
learn what is npm and how to use it on basic level.
Design Libraries and Frameworks: Learn a few popular design libraries enhancing your CSS abilities - MaterialU, bootstrap, shadcn
SPA Frameworks: Finally understand what Single page applications are and delve into one of the following React/Angular/Vue/Svelte.(React being the popular)
Learn all about the framework you are working.
Learn Testing web applications.
Learn to build and package web applications.
Learn to deploy your app on any cloud platform in free tier and learn few different concepts on loadbalancer, content delivery network and others by assuming your application will be in used by realtime users and million visits per second.
Learn W3cag guidelines
Backend-
Learn one backend/server side language: you can go with javascript and typescript since you have already gone through with it.
Learn node.js
Learn express.js or any other framework for building web APIs
Learn the protocols and standards to work with web API - HTTP/REST/SOAP/JSON/XML/GRPC/Graphql
Learn one SQL and one NoSQL database.
Use postman
Learn testing on all the applications - Unit/Performance/Integration, etc
Learn about applications and web servers
Then deploy them on any cloud platform
Learn docker to ease out your development to the production process.
Build real-world web applications say- netflix, YouTube, amazon, etc. Do not try to build the whole feature set but take some small use cases and build over it for your portfolio. Collaborate with fellow developers to create few projects.
Meanwhile for interviews learn data structures and algorithms on leetcode/neetcode
The learning path I have provided can be overwhelming, but start with the basics and you will be good at it eventually. Focus on one area that you might tend to like more ie: frontend or backend.
Building projects is very important right from the very beginning, be it silly or redundant websites, it does not matter!
Popular resources to start:
w3schools.com
https://developer.mozilla.org/en-US/(once you get to intermediate level)
freecodeacademy YouTube channel free resource for every tech and path you want to take.
Join a network of people who are at your stage and starting and get mentorship from some senior developers by connecting them from LinkedIn who went through the same path that you are willing to take.
Create a LinkedIn, GitHub, and personal portfolio and update it regularly. Apply to internships and jobs one you are ready to go to next level.
Updated
Chiranjib’s Answer
Hi Tom - Good Afternoon !
I , too started my career as a Full stack Developer ( That time it used to be regarded as an End-End Developer) . My main programming language was Java.
And had done hands-on programming Development in the same segment for more than 10+ years.
Anyway , Industry is focus towards No-code/low code development and rapid application development. Equally , User experience & design thinking skills are in high demand to convey the end user requirement in the right manner ( more of pictorial depiction than loads of text).
If you want to build a long term career in the Full-stack Web developer , there are few things you need to focus on in parallel.
a) Programming skills for UI/Front End ( React JS, Angular JS, Express JS (Hybrid Web App development/Single Page Application) or Java base languages like JSP along with Java script & CSS /SCSS , HTML 5/6, ASP .NET UI)
b) Programming skills for Backend End ( NodeJS , Java base backend framework - Spring Boot etc, .NET/C#)
c) Unit Testing Framework/Methodology -JEST, Mochha , WebDriver IO, Chai, Karma etc , JUnit , NUnit
d) Deployment Methodology/Tools - npm , Webpack , Ant/Maven with Jenkins , Git/Gitlab , Argo CD, Cloud solution (e.g AzureDevops), Terraform, YAML etc.
d) Design Pattern - It will build your foundation level to solve problems.
e) Tools/IDE to be used: Visual Studio Code , Microsoft Visual studio, Eclipse etc
Other things like :
1. User Experience - Focusing on Customer Journey Map/user Journey map , Empathy Map , User Persona, Value Stream Map etc - Tools : Sigma,Adobe XD.
2. SAST/DAST - Security Testing , Cross-site Scripting , SQL Injection. Tools : VeraCode, AppScan, SonarQubeChekmarx, ZAP
3. Performance Testing / Memory utilisation : Perf, Jprofiler etc
4. Content Management/Website development : Adobe experience Manager (AEM) , Liferay DXP
5. ChatBot Development : E.g Watsonx Assistant is a user-friendly technology to build personalized, AI chatbots, without writing code.
I hope it helps. Let me know your thought.
I , too started my career as a Full stack Developer ( That time it used to be regarded as an End-End Developer) . My main programming language was Java.
And had done hands-on programming Development in the same segment for more than 10+ years.
Anyway , Industry is focus towards No-code/low code development and rapid application development. Equally , User experience & design thinking skills are in high demand to convey the end user requirement in the right manner ( more of pictorial depiction than loads of text).
If you want to build a long term career in the Full-stack Web developer , there are few things you need to focus on in parallel.
a) Programming skills for UI/Front End ( React JS, Angular JS, Express JS (Hybrid Web App development/Single Page Application) or Java base languages like JSP along with Java script & CSS /SCSS , HTML 5/6, ASP .NET UI)
b) Programming skills for Backend End ( NodeJS , Java base backend framework - Spring Boot etc, .NET/C#)
c) Unit Testing Framework/Methodology -JEST, Mochha , WebDriver IO, Chai, Karma etc , JUnit , NUnit
d) Deployment Methodology/Tools - npm , Webpack , Ant/Maven with Jenkins , Git/Gitlab , Argo CD, Cloud solution (e.g AzureDevops), Terraform, YAML etc.
d) Design Pattern - It will build your foundation level to solve problems.
e) Tools/IDE to be used: Visual Studio Code , Microsoft Visual studio, Eclipse etc
Other things like :
1. User Experience - Focusing on Customer Journey Map/user Journey map , Empathy Map , User Persona, Value Stream Map etc - Tools : Sigma,Adobe XD.
2. SAST/DAST - Security Testing , Cross-site Scripting , SQL Injection. Tools : VeraCode, AppScan, SonarQubeChekmarx, ZAP
3. Performance Testing / Memory utilisation : Perf, Jprofiler etc
4. Content Management/Website development : Adobe experience Manager (AEM) , Liferay DXP
5. ChatBot Development : E.g Watsonx Assistant is a user-friendly technology to build personalized, AI chatbots, without writing code.
I hope it helps. Let me know your thought.
Updated
Roshan Ram’s Answer
For aspiring web developers, a strong understanding of HTML, CSS, and JavaScript is crucial before diving into advanced frameworks. Think of them as your bricks and mortar - the essential building blocks that power every website.
Mastering these fundamentals doesn't require expensive tools or a magic degree. In fact, you can get started with just a notepad and browser.
HTML: Imagine HTML as the blueprint of your website, defining its structure and content. With simple tags, you can lay out sections, headings, paragraphs, and more.
CSS: Now, let's add some color and flair! CSS acts as your virtual paintbrush, allowing you to style your website elements. Change font sizes, add backgrounds, and define layouts with ease.
JavaScript: Finally, JavaScript breathes life into your website, making it interactive and dynamic. Imagine adding animations, pop-up menus, or even simple games - all with the power of JavaScript!
Some online free tools below to get you started.
FreeCodeCamp: This interactive platform offers a comprehensive curriculum covering HTML, CSS, JavaScript, and more. It features gamified learning and real-world projects, perfect for hands-on learners.
Mozilla Developer Network (MDN): This extensive documentation from Mozilla provides in-depth information on web technologies, serving as a reliable reference while coding or troubleshooting.
JavaScript30: This daily coding challenge focuses on JavaScript, pushing you to learn and experiment with new concepts over 30 days. Interactive practice:
Khan Academy: Their "Computer Programming" section offers structured learning paths on HTML, CSS, and JavaScript, ideal for visual learners who appreciate step-by-step guidance
The Odin Project: This open-source curriculum guides you through building real-world projects like a library website, solidifying your knowledge through practical application
Mastering these fundamentals doesn't require expensive tools or a magic degree. In fact, you can get started with just a notepad and browser.
HTML: Imagine HTML as the blueprint of your website, defining its structure and content. With simple tags, you can lay out sections, headings, paragraphs, and more.
CSS: Now, let's add some color and flair! CSS acts as your virtual paintbrush, allowing you to style your website elements. Change font sizes, add backgrounds, and define layouts with ease.
JavaScript: Finally, JavaScript breathes life into your website, making it interactive and dynamic. Imagine adding animations, pop-up menus, or even simple games - all with the power of JavaScript!
Some online free tools below to get you started.
Roshan Ram recommends the following next steps:
Updated
Naveed’s Answer
Hey Tom,
Let's kick things off by getting a solid grasp of HTML, which forms the backbone of web structure. Once you're comfortable with that, you can level up by mastering CSS to add style and flair to your web pages. Next in line is JavaScript, a key tool for front-end development.
Once you've got these skills under your belt, you're ready to dive into full stack web development. But remember, the best way to cement your knowledge is by doing. So, I'd recommend working on a few projects that you can add to your portfolio.
Once you've built a robust portfolio, you're ready to step into the professional world. Wishing you the best of luck on your journey!
Let's kick things off by getting a solid grasp of HTML, which forms the backbone of web structure. Once you're comfortable with that, you can level up by mastering CSS to add style and flair to your web pages. Next in line is JavaScript, a key tool for front-end development.
Once you've got these skills under your belt, you're ready to dive into full stack web development. But remember, the best way to cement your knowledge is by doing. So, I'd recommend working on a few projects that you can add to your portfolio.
Once you've built a robust portfolio, you're ready to step into the professional world. Wishing you the best of luck on your journey!