Posted in windows
222
12:38 am, November 11, 2019
 

Using Node to get a Web Dev Environment with livereload up and running

this is how i get a live reloading dev environment up and running on my windows pc's using node , npm and browsersync.

install node js which comes with npm

run this command in your cmd window

[windows key + r] and type cmd

npm install -g browser-sync

this will install browser sync globally, allowing you to run websites from any directory on your pc

setting up a test site

create a directory in your local machine, for testing files it only really needs to contain an index.html file.

i created mine in D:\code est-webpack (even though its not actually webpack, i already had this one setup ;).

how to actually run the server

now we should have browser-sync installed globally, to run the server we have to use this command to bind it to our local ip address and custom port.

browser-sync start -s -f . --no-notify --host 127.0.0.1

once we run this windows firewall will probably popup and request access, i allow access to every network

now we can see that browser sync is running

you can now browse to http://localhost:3000/ and you should see your index.html file

if you make any changes in this file browser sync will automatically update the browser so you dont have to keep pressing F5 All the time!

everytime you change the file index.html or any other files under that directory, browser sync will reload the browser with the new files and changes.

you can see if its working by editing the index.html and saving a change and you should see the blue text saying "Reloading Browsers".

View Statistics
This Week
66
This Month
361
This Year
261

No Items Found.

Add Comment
Type in a Nick Name here
 
Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

You could also follow me on twitter. I have a couple of youtube channels if you want to see some video related content. RuneScape 3, Minecraft and also a coding channel here Web Dev.

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
You want to be the best, you MUST put the long yards in! Nothing comes easy in life so stop wishing and start DOING! So many people would rather bitch and moan than help themselves. Dont be one of those negative drainers, start today, make a small change and keep going forwards with this attitude!
Unknown
Latest News
## 🚀 AI Giants Hit Bullseye: Anthropic & OpenAI Achieve Product-Market Fit Anthropic and OpenAI have reached a significant milestone, finding product-market fit with their AI technologies, which means their products effectively meet the needs of their customers, driving growth and adoption. This achievement showcases the practical value of their innovations, enabling businesses and individuals to leverage AI for enhanced productivity and efficiency. With this alignment of product and market needs, these companies are poised to transform industries and shape the future of technology.