jglovier/resume-template

Add browserSync or webpack

giovannipds opened this issue · 5 comments

Hello. I'm not used to Jekyll but as far as I'm testing this project, having to up and down the server just to see the changes is weird. I've searched a little about Jekyll + BrowserSync and it seems that people are using them together with Gulp. I think it'll be good to development side that we implement these guys (or webpack). I know some recent projects implement webpack but I think Gulp is still simpler to this project needs. What do you guys think about it?

Searching a little more about it, I saw this as requested on the original Jekyll project. Someone has implemented a plugin for it, using LiveReload: https://github.com/awood/hawkins

Hi @giovannipds! Thanks for bringing this up.

I'm not used to Jekyll but as far as I'm testing this project, having to up and down the server just to see the changes is weird.

Do you mean specifically you are having to switch back to CLI and restart the server to view your changes?

The jekyll serve command (I run it as bundle exec jekyll serve in this project) automatically regenerates the build as you save files, so all you need to do is refresh the browser to view your changes. Is that what you are experiencing, or is it not regenerating on on the server? Or are you asking specifically about the need to refresh the browser too?

@jglovier sorry for answering this so late, now I'm not much sure about what you've asked but, I remember that I was needing to close and open the server everytime to see the changes (it may be something that was happen only to me).

But YES! I don't like to refresh browsers to see changes. That's what I'm bringing up here.

@giovannipds I would like to recommend an alternative solution. There are obvious pluses and minuses to including a dev server into a project, especially something like a jekyll template. To meet your needs, an option would be to globally install browser-sync (or dev server with live-reload of your preference), then have it watch the generated content of your jekyll _site/ dir (the built static files), and have your dev server port forward to your jekyll server's port.

Here's an example w/ browser-sync.

  1. if it's not already installed globally, npm i -g browser-sync
  2. start your jekyll instance, bundle exec jekyll serve
  3. start dev server, browser-sync start --port 8000 --proxy localhost:4000 --files _site

I'm going to go ahead and close this because there are no actionable changes to the project to result.