Setting Up a Windows PC For Web Development: WSL, Git, Node.js, Docker, Oh My Zsh, & MySQL
Вставка
- Опубліковано 27 лип 2024
- Join my premium 2024 bootcamp here learnwebcode.teachable.com/p/...
Let's walk through setting up a Windows PC for web development, and use Windows Subsystem For Linux as the backbone.
Finished product Node.js code: gist.github.com/LearnWebCode/...
Finished product Docker Compose file:
gist.github.com/LearnWebCode/...
0:00 Intro
1:03 Windows Subsystem For Linux
5:24 Just For Fun: cmatrix
6:20 VS Code Integration
8:57 Oh My Zsh
11:00 Git
15:52 Windows Terminal
20:40 Node.js
24:50 Docker
33:18 Upgrading From WSL1 To WSL2
38:25 MySQL
Follow me for updates on new videos or projects:
Instagram: / javaschiff
Twitter: / learnwebcode
Facebook: / brad-schiff-1542576316...
Twitch: / learnwebcode
At 1:55 and 3:50 you were in select mode (as evidenced by the changed window title). Microsoft made it easier to copy text from the console window and PowerShell. You need to press [Esc] to exit this mode.
Thank you so much! I was hoping someone would know what was going on there; I did not notice the changed title bar. I looked up select mode on StackOverflow and yep, it says if you click on the console it enters select mode "and pauses the script until you hit space, enter or escape." I had no idea; thanks again!
I can’t stop laughing when it happened twice
Yes you press escape. Yes I yell at my screen every time it happens. What a stupid "feature".
@@LearnWebCode Just figured out right-click also restarts the download
or right click can bring you out of that mode also
Brilliant explanation of so many technologies ‘packaged’ neatly in one video. I really do like where you explained where things went wrong & more importantly why. Mega 👍🏽
This tutorial was an absolute gold mine. I learned a lot and got many ideas. I liked how the command shell looked beautiful after installing Oh My Zsh. Thanks, mate.
Great video. Eerily precisely what I was looking for with WSL + vscode + Docker. I strongly agree with your leaving in "mistakes" and explaining the solutions you find. So often the constructivist approach is the best! Thank you!
Man, I am so grateful for this job. In addition to the quality of the information you speak in such a way that people that have just a little knowledge of english can understand. Thank you !!!
Showing your imperfect experience with installation right off eased my fears that I'm learning challenged. I'll be more patient toward my self in the future. Thanks!
I was in awe on how you delivered this video. Was easy to follow but best of all your mindset when doing so. Bravo. I learned plenty.
I've learned frontend dev for a couple of months now. Starting my backend learning, and I was having a hard time setting up the dev environment, especially using wsl. Can't thank you enough for the tutorial, really great video. Thanks man
I appreciate and enjoy your teaching and "learning" style. It is very helpful to know your thinking and problem solving process.
One of the best tutorials i've come across, thanks very much!
dude i cannot thank you more , I am working on a project based on API testing and this is exactly what i needed . DUde youre a life saver dude thank you man
Mr Brad you're the best teacher.
You teach me a lot of things thank you 🙏.
I absolutely love the rawness of this video, if errors come we fix it together with logical approach and not just cut that part!
Thanks so much for this video, it took me a few tries to get everything right but now I have a much better understanding of Docker and how I can begin to match environments locally with hosted websites :)
Thank you so much, I have learnt quite a lot. Will be looking out for more of your tutorials.
Really exciting times developing on Windows with WSL. Scott Hansellman has some great content on WSL too
Great video Brad, i have previously installed wsl through Windows store and forgot the actual process . This video should help.
Excellent. This is the best gift for New Year!
On my machine, I had to change the forward slashes at 36:54 to backslashes, even though Windows documentation for Terminal troubleshooting states "On newer versions of Windows, startingDirectory can accept Linux-style paths." So YMMV rules again. Great video!
Im in process of moving from Mac world to windows, and this video is like Miracle, thanks ✌️
Excellent Step by Step Guide to Docker Dev Containers. Thank you.
Great video! I learned so many new tricks. thank you
I almost skipped this video. Glad I didnt. Great content. As a Windows user, I really like WSL.
Thank you! I have been working with WSL2 for a while, but I'm completely new to Docker. This video helped me understand how to use WSL2 with Docker!
15:27 How to exit git ?
So grateful to you Brad. You're pretty much a lifesaver
Works like a charm, thanks man!!
I love that you didn't cut your imperfect scene. Anyway, thank you for sharing your knowledge
Thank you so much man I'm new to web dev and this video was super helpful!
Very well documented! Thanks!!
Amazing video, excellent explanation!!...the explanation helped me a lot!! Thanks!
Just finished this great tut and thanks for that.
It took me some time but that is because along the way I also spent time to get Ubuntu as Docker running on my T5 and were I succeeded in too.
Awesome video. Now I'm really thorn between a windows machine vs mac to go back to school!
the best video i've seen in my life thank you
Wow Good Explanation..I did all the part with minimal errors..❤️ Thanks dude
Amazing video! Thank you
Wow. Great tutorial and explanation
I came here to see how you would configure a WSL2 dev-env but left with a docker/mysql mini intro. I really appreciate that. Thank you and i hope one day i can reach your level of proficiency.
Best environment for sure! Thanks!
This video is so helpful. Thank you m8.
Nice explanation thanks for share this information
Great tutorial, helped me a lot.
Superb ❤️. Thanks brad
This video helped me so much thank you
SUPERB, simple, thanks
THIS is what I’ve been looking for
i never watched any of your youtube videos but once i heard you talk i knew you were schiff but i leaned from a fw of your udemt courses 🤓😄
very nice thank you very much for this video!
brilliant video!
Thanks so much for this tutorial. Really useful and funny @ 4:30!
Great vid!
Super! Thanks a lot!
Great video ❤
The best part was fixing the issue that he got in the process which helps a lot.
Marvelous!
bro you earned a subscriber !!
God bless you for this piece.
3.7k+...Thanks. Great tutorial !!!
Wow! Thanks man!!
I commend your work. Good work. I still cannot fathom having to work on windows. What a nightmare, going through all these hoops just to get something so basic done.
I showed cmatrix to my partner but she wasn't convinced of anything, just kinda shouted 'whyyyy' at me. Thanks for the vid!
at 18:13 for those who are getting error which is "value is deprecated" . The error message you are seeing may be related to changes made in the Windows Terminal app. In the latest versions of Windows Terminal, the "useAcrylic" and "acrylicOpacity" properties have been deprecated and replaced with "backgroundImage" and "backgroundImageOpacity".
To fix this error, you can update your Windows Terminal settings.json file to use the new properties. Here's an example:
"profiles": {
"defaults": {
"backgroundImage": "path/to/image.jpg",
"backgroundImageOpacity": 0.7
}
}
what worked for me was to just use opacity like this:
"profiles": {
"defaults": {
"opacity": 70
}
the number has to be between 0 and 100
Nice man 😍
Super useful
Wow the best tutorial on dock for windows. please can you do one on mac for us. Thanks man!
godd$#@! this guy is amazing, keep going with this incredible job. I just finished your WordPress Development course on Udemy, very well designed I'm fully applying everything in my current job. Thanks brad!
I was using Ubuntu on my PC, AMD ryzen 3 2200g, I and just get enough of the Ubuntu boot (grub) issues, So decided to give it a try on windows, so far so good, totally worth it.
Hi this is really good sir I hope some day you make a very intuitive course about PHP
great, Thanks a lot.
awesome 😎😎
Thanks man
Great❤️
at 19:30 where you can change the profile starting directory in win 11 pro 22631.3296 it doesn't seem to matter if check off the box for "use parent process directory" it still opens in the in the directory you are in. followed your directions, everything looks the same but it'll only open in the directory I'm currently in
Thanks!
Wow! An amazing video. Seems to cover everything I need to set up for the microservices course I'm taking right now, except Redis. Though, I would like to do everything you're doing in the video, directly in Kubuntu 21.04 full standalone install. Is that a more viable option or worse? Anyhow, thanks again for yet another very helpful video.
Working directly in Kubuntu would be even better; skip all the WSL configuration and just get the real thing 🙂. As for Redis, the Docker hub page should have some starter composer code to get rolling. Docker (docker.io) is in the Ubuntu repositories, but I think it's a pretty outdated copy. If you Google for "installing Docker Ubuntu Digital Ocean" you can usually find great up to date guides. On Linux, it probably feels dirty to use VS Code with Microsoft's telemetry / branding etc, so VSCodium looks pretty cool! github.com/VSCodium/vscodium
26:13 Your cat said "NO".
& this was easy to folllow along, really Whatever you teach becomes easy.
😹 That was a "no" meow if I've ever heard one.
Exactly it is at 26:16 . But watching from 3sec earlier you can get the scene i.e.You're accepting the agreement but your smart cat is saying "NOOOOOO".
Just install apache2. Love your videos
Amazing!! U should make this tutorial for laravel also...
I'm very grateful for this video! I used to like Windows, and now that I have access to Linux without using a dual boot or virtual machine, it's priceless!
I love this tutorial so much. It's so fun to watch. And it clearly shows me what I should do and why.
Just one noob question: why install Node.js on Linux? Is it bad to use Node.js in Docker?
I'm glad the video was helpful! There's nothing wrong with using Node in Docker; for the actual environment of your app it's actually ideal to use Docker, because you can easily mimic the live/production environment that way. However, there are also many NPM tools that you'll want to run to do "local'ish things and so I always want Node available from my real command-line as well.
Thank you so much. I am in the process of learning JavaScript and a guide I'm following required this setup and it so much cleaner than the mess I had before. I have a question regarding the docker image we set up in the /db folder. Now when I try to git add -A I cant because "warning: could not open directory 'db/pets/': Permission denied"
I cannot figure out if this is normal and I just shouldn't try to commit the folder, or if something is wrong. And if it is normal, what kind of folder structure is normal then, because it doesn't feel great that I have to commit every single file separately because otherwise the /db folder will complain?
You are amazing!
🙏
@@LearnWebCode 15:27 How to exit git ?
Thanks for this, btw one quick question if I use only the docker in wsl2 and running node on my windows will that affect/increase the speed rather than opening my source code in the remote wsl directly?
This iw awesome! Thank you.
I have follow up questions. My reason for installing WSL was to use ddev...
You did this thing where you mount your C drive in Ubuntu. If I do that, will I still be able do my ddev stuff in my Linux home directory?
Or will that be available from anywhere?
Hi, previoursly I have used the conda environment in windows with vscode, now if I want to choose ubunto as a default profile in vscode how can I use conda and such environments I used in windows terminal?
Ok Bucky Robert 😍 👏
36:49 It's important to emphasize that this only works if your "Command line" field is set to use the "wsl.exe" binary and not the "distribution-name.exe". I had a hard time trying to figure out what I was missing.
15:27 How to exit git ?
Thank you. It took me hours trying to figure that out until I saw your comment. In the meantime I also discovered that, if you are using zsh and for example want shells to open at /home/nick/sites, you can add 'cd ~/sites' to the bottom of /home/nick/.zshrc, by entering echo "cd ~/sites" >> ~/.zshrc at the Ubuntu prompt. But it seems better to change the 'Command line' from just 'ubuntu.exe' (or whatever) to 'wsl.exe -d Ubuntu' so that the 'Starting directory' setting can be used.
WSL is kinda cool thing, you can experiment on it and get educate yourself on linux servers.
I install things on my windows machine using chocolate. similar to the brew on mac.
very similar experience for mac users. recently i ditched my 2018 macbook pro and using windows desktop PC most of the time.
but i don't use docker. i tried it before but have found no use for it . just fills my ssd for no apparent reason.
had no issues building my projects on linux server so far.
That's true, if you know what you're doing when configuring Linux for your dev stack, and you don't have any complex / scaling / deployment needs then Docker isn't necessary. I like it because I'm still learning about rolling my own stack in Linux and so it's nice to be able to mess up an image while experimenting, and it's even faster at spinning up a new one than VirtualBox.
thanks
Hi, really loved your video a lot! but i ran into a problem. everytime i use the command 'node index', nothing happens and i just get a blank console. any suggestions on how to fix this?
Great video by the way, helped me a lot am new to linux, just figured that i need to know how to use it as a web developer(backend) especially the ubuntu distro, but unfortunately, i cannot upgrade to wsl2 because my computer didn't meet the requirements therefore can't use docker (very worried) could you help, is there a way to use docker with the wsl 1?
2021 December - the time Brad used Windows !
😂
A connection with the server could not be established
I am getting like this , what can be done?
How do i accsess a folder in wsl on a Flash drive?
Does any one know , what's with the buzzing sound in terminal ?
okay I changed the setting for default directory in terminal and I total lost all access to my windows structure. I used to be able to cd in and out of windows file system. now when I use ls -a I get like bash and zsh files. Then when I open vs code and start WSL at bottom left it only shows .cache, .ohmyzsh and .vscode server. When I open from local desktop it takes me out of WSL ubuntu
works gj
why name of ubuntu folder selector not display ?
not able to find the zshrc file and cannot run npm commands
How did you add the paths in zshrc file cannot do npm install it says zsh command not found
Does it matter if I use Windows 10 home or Windows 10 pro?
can i have two copies of node like one for global windows and other in linux zsh