Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Development Tools

Local preview website in Chrome with Atom

Hi All!

I'm currently starting to work on my first project in Atom. But is there a way to live preview my website in Chrome via http://localhost ? I know it's possible because I did it once with a static website generator via the terminal. But I can't find a way to run my website in localhost without the help of a static website generator.

Please help me out :)

Cheers!

Sue Dough
Sue Dough
35,800 Points

Hey Daniel. You can do this easily. What operating system do you use? You may need to install Apache or some type of server environment first. Ideally all you need to do is figure out where your localhost root folder is located once your environments set up properly. Then you could add a file called test.html and simply view it by going to http://localhost/test.html . You can also usually right click and open a file with a browser.

2 Answers

If you use Node.js, check out http-server:

npm install -g http-server
http-server

And view in your browser: http://localhost:8080/

If you have Python 2.x installed (comes preinstalled on Mac OS X and most flavours of Linux):

python -m SimpleHTTPServer

Or Python 3.x:

python -m http.server

And view in your browser: http://localhost:8000/

Note that you should run these commands in the directory that you want to serve the files from (generally wherever your index.html lives) and use relative paths to things in your HTML and CSS.

Thanks Iain! Works great!