Learn web development as an absolute beginner
VloĆŸit
- Äas pĆidĂĄn 1. 06. 2024
- đ„ Learn how to build a responsive website from a Figma design with HTML, SCSS, and JS: coder-coder.com/responsive/?u...
đ» Become a full-stack web dev with Zero to Mastery: academy.zerotomastery.io/a/af...
Want to learn to code? This video will cover a roadmap for beginners, with all the basic web development skills you will need to know.
00:00 Intro
00:50 What is Web Development
01:05 How Websites Work
01:37 Front-End And Back-End
02:43 Code Editor
03:27 Basic Front-End
03:39 HTML
04:13 CSS
04:43 JavaScript
05:02 Tools
05:12 Package Manager
05:51 Build Tools
06:34 Version Control
07:13 Additional Front-End
07:31 Sass
07:56 Responsive Design
08:33 JavaScript Frameworks
10:00 Basic Back-End
10:11 Server
11:08 Programming Language
11:33 Database
_____________________________________
SUPPORT THE CHANNEL
â Join channel members and get perks: / @thecodercoder
đđœ Hit the THANKS button in any video!
đš Get my VS Code theme: marketplace.visualstudio.com/...
WANT TO LEARN WEB DEV?
Check out my courses:
đ Responsive Design for Beginners: coder-coder.com/responsive/
đ Gulp for Beginners: coder-coder.com/gulp-course/
RECOMMENDATIONS
âš My keyboard-- get 10% off with code THECODERCODER -- vissles.com/?ref=mu96kxst5w
đ» Other gear -- www.amazon.com/shop/thecoderc...
đ My Favorite Books -- coder-coder.com/best-web-deve...
đș My Favorite Courses -- coder-coder.com/best-web-deve...
đœ FOLLOW CODER CODER
Blog -- coder-coder.com/
Twitter -- / thecodercoder
Instagram -- / thecodercoder
#webdevelopment #coding #programming - VÄda a technologie
I'm 64 years old. Just started learning. Never give up your dreams of working at a startup!
I am almost 40 and also starting now. Never give up your dreams! Keep going strong Chris. I love this video. I can not add anything to what the rest of the people are saying.
You inspire me đ
and i'm 18 yo who curses himself everyday for doing nothing
you're motivating
great job, keep your work, chris!
@@medd2588 im 17 how are you starting bc im sooo lost
As someone who's done programming and web development for 15 years: This is an excellent summary. Good luck to everyone who is just starting!
A small tip from me: web development can be very rewarding, but also quite frustrating sometimes. If you find yourself stuck (it's normal, and happens to everyone!), take a step back, go outside, meet a friend for coffee, have a glass of wine/orange juice, or do whatever else to clear your head. đ
thanks for that advise
Is there a website that just gives you web developer problems to solve?
@@VandalVortex No, why? You can always challenge yourself by adding new features you have never build before to your web apps. Or you can ask people around you if they need a web app, if they do try to analyze their needs and what kind of features they expect. I'm not sure with the others but that's how i learned a lot of things in Web Development, working on a real world project is always the best learning method.
@@kurniawanpratama6413 Thanks for the reply. Why? I like having different options when it comes to learning. I'm not sure what the issue is. I'm asking for a website for real world web developer problems to solve so it's easier to understand what is expected of me in that work environment. Personally, I would like having images/video clips of designs or features in a list. And then those pictures/video clips would be annotated with "build this in xxx" or "Improve this". Sounds like something I would make if I had enough experience.
@@VandalVortex Try to take an internship program in a company, i would recommend applying to a startup company, you can learn a lot of things from there. Good luck!
I have watched a combined total of 25-30 hours in web dev tutorials. Helping with maybe 10% of what I actually wanted. You somehow managed to answer questions I hadn't even been looking for while also filling the remainding 90% I needed covered. Thank you!
I'm so glad my video could help you!
If you wasted 30 hours and barely learned anything, then I'd recommend finding a new hobby.
@@ibrahimtech1581 the most stupid advice ever
Yippee! I'm 58 and excited to start something that sounds interesting, not just something to do to earn an income
@@ibrahimtech1581 nothing is easy bro. đ
This is probably the best video I've seen about this subject. The step-by-step roadmap is such a big help for me and other aspiring self-taught developers that have no lesson plan available. Than you so much for this AMAZING content!!
10 months ago I watched this awesome road map and started learning web development step by step. In 2 days I have my first interview for a full-stack MERN junior web developer. I just wanted to thank you!
Wow, that is really awesome!!! Congratulations đ
@@TheCoderCoder Thanks! :D
Okay now I'm excited
That's great man, how did it go? Were you an absolute beginner when you started watching?
Nice!!
How do you look and sound so fun yet so professional at the same time..
She's a noob, if you cant even code a website in binary dont even try coding it's not for you.
@@BillClinton228 lol r u out of mind sir! U don't have u show everyone that u can do it using binary. No one care.
@@BillClinton228 Stop lol, you don't have to program in binary this is a new day and age catch up
@@goodppl9401 Yo has a point, if you can't harvest your own silicon and make a CPU from scratch, can you call yourself computer-literate?
@@aiyazmostofa1501 yo thanks man!
I'm just starting to seriously look into web development as a potential career and this video was so clear and helpful. The graphics, layout, similes, metaphors, and every other teaching technique used were very well executed as well! Cheers!
It's so rare to see such a simple and easy-to-understand, yet packed full of important and useful information tutorial, not only connected to programming, but pretty much anything. Coder Coder, I thank you from the bottom of my heart for this short, yet very useful tutorial!
The quality of the information and production of this video is so high! I love it !
Thank you so much! A lot of love and hard work went into the making of this video, for sure!
I thought the same thing! I am impressed with the graphics used. Makes a topic that can be dry as hell feel less boring.
@@TheCoderCoder Any courses that you run on the same, may be on your website perhaps..?
Really
100%! I am glad I am not the only one who needed to express this haha
The tone of your voice, pronunciation, and the speed at which you speak is so perfect đđ»
Right? every video i see ive to speed up 1.5x. This one is perfect!
I agree.
Agree
+ good video editing. She is super!!!
So True.
This channel is amazing!!! The animations, the info, the way that you speak, everything is just perfect. I am so grateful for this, definitely sharing 'em to my friends
Great voice over, well structured info and great animations on top of that. Thoroughly impressed. If you ever create a course on skills skillshare or whatever, let us know
Here is my way to "THANK YOU!"
00:00 Intro
00:50 What is Web Development
01:05 How Websites Work
01:37 Front-End And Back-End
02:43 Code Editor
03:27 Basic Front-End
03:39 HTML
04:13 CSS
04:43 JavaScript
05:02 Tools
05:12 Package Manager
05:51 Build Tools
06:34 Version Control
07:13 Additional Front-End
07:31 SASS
07:56 Responsive Design
08:33 JavaScript Frameworks
10:00 Basic Back-End
10:11 Server
11:08 Programming Language
11:33 Database
Thank you!
Welcome...
Oh my god ,thank you so much .
Because of people like you I love CZcams.
@@mridang2064
Thank you
WHAT THE HELL. How can someone explain with such elegance? Thank you for this awesome content!!!!!
Great video ! Itâs very clear and well-built, just what I needed. Iâm considering to learn web dev and you definitely helped me understand whatâs at stake and what I need to learn. Thank you again !
Thanks for creating the clearest, most straightforward web development roadmap on CZcams. Just wondering, if youâve already learned HTML, CSS, JavaScript and JQuery how long does it take to learn the rest of the front-end steps?
The editing in this video is so high quality, it blew my mind!
I usually get discouraged when I listen to someone teach me something that I can't make sense of, but something about you makes it exciting to learn. I think it's your voice. It's calming, doesn't make me feel dumb, and makes me feel hopeful without being "too good to be true" too much if that makes sense. Thank you!
Yes yes I felt the same way. Her voice is very calming and I learned sm from this video
Same here
I am in the same boat as you when it comes to the feelings.
We canât give up! The world is changing and everyone has a way to accomplish what they want in their own way. We got this đ
GREAT teacher, "Coder's Coder!" You bring categories and priorities to everyone teaching their expertise!
3 minutes into your video and I must say, you are the first one to make ANY sense from all the begginer videos I've seen. The other videos seem to presume you already know terms like front/backend and full stack. Thank you VERY much for this extremely well done and informative video!
This video is gold! I will be referring all my beginner students to this. Awesome starting point for web dev
is django easiest rather than laravel?
Dennis Ivy your videos are platinum. hhhh
@@AhmadAli-wt8zy appreciate it :)
@@justlutfi2890 donât know if itâs easier but Iâd recommend it
Lol you are here
Mind blown, loved it. How come you don't have a million subs now!
haha thank you! I'm just starting out, 1 million subs would be a dream for sure :)
@@TheCoderCoder ma'm, I can bet that you are definitely going to reach the million subscribers milestone very soon given the quality of your content which is quite the best among all others out there on the internet!
@@Shakeel714 Thanks so much, hopefully someday!
Coder Coder Excellent Job! đđŸ
Everything about this video is literally perfect! The BEST video I have come across while researching this to date! The production, the editing, the graphics, the explanations, everything đ
Your content was amazing!!! I also went through all the resources that have been mentioned in the description. Thankyou for providing such great resources. I have been trying to learn web development for a week now. And it has been going good. But all the content shared by you has boosted the process. I just want you to know that you are doing a great job and making really helpful content. Thanks again!!!
WOW, such production quality!!! :D
I can't imagine how long this took to edit and put together! :)
Agreed.
One of the most Informative video I have ever watched in my Life.
me too , way better the future is bright
I wish I would have seen these video some years ago
I thought It was all hard until I watched this
I just found your page and I must say. I really look up to you. Thank you for taking the time to help us. You've been such a blessing.
I know i'm technically late but this video is criminally under-viewed!!! thank you so much for breaking all of the learning steps down into a less intimidating explanation :) I'm very excited to pursue a career in Web Development
This video made me learn a lot about myself. Iâve realized I want to become a front end developer. Iâve always had a strong interest in interior design đ€Ż
Wow me too:D
ME TOOO HAHAHA
You may want to consider being a ui/ux designer in that case. Front end programmers very frequently have no say on the actual design of the website, they get it from a designer and they just implement it.
Amazing. Thank you so much!! I love this community for this very reason. Once someone learns they reach back to help the next person! Iâll pay it forward.
I'm glad this video was helpful! Best of luck as you learn coding đ
I love this already, and I just started watching it! I was so nervous about starting these new courses! You've made me feel so much better about it! If I can have something broken down, I can understand it!
Thank you! I started a Web Dev course but hearing all these different programs and applications had me confused as to the purpose of everything. This really helped me get my head around the basics of the most popular, what they do, etc. Really helpful!
Damn this is good, as a web dev for 16 years, this is a great primer with awesome production value. This will put you on the YT map!
I learned so much from a 13min CZcams clip than I did at school. This was awesome. Made it so easy to understand đ thank you.
Awesome! I'm so glad this video helped you :)
Probably from an INDIAN School. Yeah , although o second him there.
@@tempedits9457 I don't live in India nor I'm Indian and I've never been to an Indian school.
@@tempedits9457 BUMMER
@@tempedits9457 ok boomer
Wow! Love the production quality and fast, but complete, flow of information. Finally a beginner's guide worthy of the name
Wow great video! I spent some time on CZcams and this is the best summary I could find. Concise, clear, accessible, visually appealing. Well done!
Thank you!!!!!! Finally, a clear and understandable guide! I have been studying for a few months and whilst aware of these terms, I just didn't get them. You've cleared up so much for me!
Thank you for the clarification that when a job asks me to be able to do motion design AND web development, they're asking for two entirely different careers đđŸ
Thank you so much for explaining everything that is necessary for us to know. Some ppl just explain html css and js. And then theyâre done. Iâm definitely following you
This is a lifesaver! You just summed up my entire previous semester which I felt like I almost forgot but now I feel good about myself...Thank you!
You've inspired me to continue my dream of becoming a web designer and developer.
This video is exactly what I needed - clear, concise and simple to understand! So many âbeginnerâ resources are written in jargon. It makes it really hard to get started.
I just found your video and I absolutely love your content. I am beginning to start tutorials to learn web development and cannot stress enough how impressed I am with how easily you were able to describe what I thought was very difficult concept. You are an excellent teacher and The quality of your videos are Topshelf. Excellent value in teaching and delivery. Five stars. Subscribing now! Keep up the good work!
First year CS student here. This video gives me a clearer insight on the whole CS environment and solved a lot of my doubts. Big thanks!
I'm loving the logical structure, the simplicity of explanation and the great illustration of the video. I'll definitely recommend this to anyone looking to start Web Development. I'm impressed. Thank you.
Thanks a lot for doing this video, it really helped me crack the general concepts. Not to mention the dedicated illustrations, love your style and all the effort in editing this :)
I'm just getting into learning to code and this was very helpful. However, as a current teacher, this is about as good of a piece of instruction on CZcams that I've ever seen. Thank you.
Hey. How has it been?
Any advice for a newbieđą
This deserves a million views and subs. Thank you for this info. I'm starting from scratch, and this has been a massive help!
Thanks for your kind words! Best of luck in learning :)
That was absolutely brilliant! The way you presented it was phenomenal! Don't even get me started on all the animations...Great job!
Easily one of the most informative and useful videos I've seen on how to begin with web dev, I loved the graphic of your road map.
This is so helpful! I'm a student and trying to learn more about web coding-
This sums up neatly of what I need to focus on!
Letâs all just appreciate how good is thethe videoâs production value and attention to detail-ness ! Apart from precise information !
Awesome Job !!
This was SO incredibly helpful!! Thank you for making content that's clear and to the point that can really get people on the right track!
Thanks for the guide! out of all the videos I've watched till now, this was the best at actually letting me know what I'm getting into!
This is an excellent roadmap / intro to webdevelopment. CoderCoder's videos are very well produced . One of my favourite CZcamsrs on coding đđđ» 10 / 10
As a Full Stack Developer in the industry for some years now, I can definitely vouch for your content. Short, crisp and high-quality.
it doesn't matter how much I learn in web development and programming in general, I always feel like I'm behind everyone
This is the best CZcams content I've come across. So well detailed and packed full. Thanks from Nigeria .
After 10 seconds of watching your video, I subscribed! :))) why? Because this was the most comprehensive, interactive and straight on point video on coding that I've seen in years!
This is the quality content I was looking for on CZcams. Great work gal!
What an AMAZING presentation. As a IT recruiter and new to this tech world, I just want to thank you. What a class!
Thank you for this! I recently became interested in web development after doing some basic html for my current job and I dabbled a little in college. Awesome editing as well!
I love how you explain these things †so clean and sooooo generous! â€
The contents and presentation were absolutely amazing! Will check out the resources provided. Thanks a lot and good luck!
Girl I really hope youâre doing your best in life!
Thanks for this very informative video hope to see more videos like this.â€ïž
This is actually one of the best videos Iâve ever watched
OMG Just amazing explanation and even more amazing video editing! As a blogger I understand how much time did you spent to bring us only one part - all that animation. Thank you very much!
Thank you - I've been searching for this information like this for. years. plus you made it very enjoyable to watch!
This is the best video explaining web dev for a beginner that I have seen so far! Thanks a lot!
omg that was amazing. you did the impossible, combined entertainment with learning/education.
Youâre amazing! Thank you for this insightful roadmap.đđœ
Wow thank you so much for making this video! I started learning web development from a month ago and still confused and overwhelming because so much thing to learn. I'm so grateful for watching this and helped me a lot!!!
Holy heck these are some beautiful animations. I love the visual style of this video. Also, an excellent introduction. Thank you!
You've got a new subscriber.. You're just amazing. This is exactly what I was looking for a long time.. Thank you ma'am
I'm glad youtube recommended me this video. Also, your animations are so satisfying!
Thank you. That was like an executive summary with a huge document to be looked at afterwards. Thanks so much! Keep going!
This is Genius! This is by far the best layout of the raod to becoming a developer I 've seen thus far. Giving out the structure and suggesting the best approach like commencing with front-end and then progressing from there. Thanks alot!!!
Thank you so so so much for this amazing video! I seriously never comment on videos, but I had to here. This was so helpful for me to understand what web development really is as I was kinda on the fence whether to pursue it or not. Thanks!
Amazing video, extraordinary animations, professional voiceover. The overall quality of this video is extremely high. Congrats! How long did it take you to create this?
Thank you so much! Tbh the video took probably a month from start to finish, working on the side (my husband is a professional video editor / animator / creative mind, and I wrote the information for the script)
Could you mention your husband profile / name so that we can follow him as well?
Listen guys, this is the best introduction to website development ever!
Been looking for a tutorial that summarises start-to-end of website development and this is the best!
Thanks thanks so so much!
Excellent breakdown! I've been in tech forever, systems programmer and admin, always hated webdev. Its still around so I figured I better get to know it. Learning all these frameworks and wondering why lol and now I know
I was also very confused about where to start , thank you for the video
I gotta say this was one of the most helpful videos Iâve seen so far. Short and sweet but also a good amount of informations
Thanks for the overview! Very helpful and your production is on point!
I saw a lot of tutorials in CZcams, and I can tell this is the best, it's very understandable and use a basic language that everybody understand. Thanks a lot
I am 21 years old and am gonna be programming and this video is my first step â â â„ïž thanks
What is your progress so far?
Same Here!
@@framequality5341 were are you from?
I start a course on Monday, and nervous af
Me too .same lolđđ am also 21 dude
Thank you for telling all the steps one by one. Best video on CZcams in my opinion. Also best edited thanks to the editor
Youâre amazing! Your tone of voice in prĂ©sentation is perfect! You made this fairly simple to understand. Thank u
I have never learned so much in such short time !!
Thanks to you !!
I just started in my journey as a Web Developer. Glad that I found this video. It motivates me more. Btw, the editing is beautiful!
Im a total total beginner like i didnt even know it was a thing. I wanna learn it so bad. But i do t understand a thing. đđđ
@@seasons1146 yo estoy tomando un curso en azul school tambien soy principiante te lo recomiendo mucho
I'm so much in love with the visual aspect of this video!
thank u so much for this video, as a guy whos been learning how to code for months with no idea what to do with it or anything, this helped me understand what is really going on in web development
Woah, that explanation was lit đ„!!
Wish you were my tutor in the university.
This video is invaluable, pure gold for all of us who are just getting started. Thanks a lot âđ» đ
That front end back end and full stack diagram is goldđ
Thank you đ
this was by far the best explanation i've watched on youtube. Appreciate the breakdown
This is such valuable content! Thanks SIS!
I was into coding a lot last year but i didnât know when or where to start, then i came across this amazing video and I definitely think front end is gonna be fun. Lets hope a 14 year old like me can figure this out!
Ey 14 y/o squad
M 15 and m still confused ughh
All: one step at a time! Follow the path outlined.
@@tomrkba4685 Im 13 and started js last year. Good language if your starting to code.
A 14 year old begginer has joined the chat....
this video is exactly what I've been looking for i really want to get into front end and this makes it so much easier thanks so much for making this video, seriously your awesome.
gotta appreciate the quality and content of this video ! I thank you on behalf of the whole internet...