Photo by Philipp Katzenberger on Unsplash
This is a preview from my CSSBootcamp.com course.
If you're newer to web development, I understand it can feel a bit chaotic when you want to just start by building something simple. This video shows you how to setup a local server in three different ways so you can run your website on your machine "locally".
#1. VSCode Extensions
If you're using VSCode, you can probably setup a local server for static HTML, CSS, and JavaScript websites with an extension called "Live Server". Just go to the extensions section in VSCode and search for "Live Server"
Install it and then click the "Go Live" link in the footer of VSCode. Make sure you have a project folder open so the extension knows what folder to use as your server. See the video above for an example.
#2. Starting a server from CLI
These next two options require just a little bit of CLI knowledge. Even if you don't much CLI, you'll need to learn it anyways as a web developer so take every chance you get to learn something new in CLI.
We're going to use a Python command to run a server on a Mac. Python comes installed by default on Macs so we don't need to do much. Even if you're not doing Python development, this is a very easy way to run a server when you need one.
Make sure you cd (change directory) to the one you want to use as your server's root path. Checkout the video if you need more help with that. Then do:
python -m SimpleHTTPServer 8000
Now go your browser put this in the URL.
127.0.0.1:8000
Do Control+C to quit the server when you're finished. Since it's a python server you may need to do Control+C twice.
#3. Node and NPM with BrowserSync
If you already have Node installed (do node -v to see if you do), then you can use BrowserSync after you install it with
npm install -g browser-sync
Now you can just do from any folder and get a server
browser-sync
If you don't have Node/NPM installed, the video walks you through those steps as well.
Top comments (0)