Exercise Options
- Export something you made in VizHub
- Put it in a GitHub repository
- Adopt a build tool (Webpack, Rollup)
- Try a newer tool (Parcel, Snowpack)
thanks for the excellent episodeā¦ got to get used to build toolsā¦
Is there a class going on? where can I sign up?
An experiment of mine using rollup.js with a project coming from VizHub
Hey @curran, for me it is not interesting to do it locally. At least yet. I usually do my stuffs with python/django, soā¦ long excuse short: I havenāt made exactly the exercise you asked (export it locally). But I indeed learned a lot. And here is a code that I studied and fixed to run in vizhub:
When will be the next class??
1 Like
Very nice!
The next class will be this Saturday. See you then!
Why not both? You can always use Django, Flask or any other Python-based Web framework as a headless backend to expose APIs consumed by your bundled D3 Vizzes 
PS: Just 3 things about your Gantt: cool, cool, cool!!!
1 Like
Another experiment, this time with Vite (the name comes from the French word for āfastā, pronounced /vit/ [āveetā] ):
With a very minimal configuration you can:
- start a dev server (with browser livereload included)
- bundle your project dealing with HTML/CSS/JS, cache busting, minification, etcā¦
- serve your bundle for a preview
1 Like
Hey Floating Purr (@floatingpurr aka Andrea) , thank you!! The merit for the gantt actually is not mine (and I canāt say it belongs to the place Iāve āsnuckā from (it is in the readme file, first line).) I just read the code and ātransposeā using what Iāve learned so far to make it work here. Add few small features on the way. But hey, thank you!!
And how cool is yous? WOW!! 
1 Like
Hey Felipe @maion, I do believe that even ājustā tweaking code isnāt a trivial task if someone is not aware of the logics behind the scenes. So, great job!
The mine is just a little variation on the exercise of Episode 5.
Bye!
1 Like
Hi Curran!
Thanks so much for these episodes!! Saturdays are busy for me most of the time, but I still think the live format is lots of fun!
I have no problems running my vizzes out of my editors with some extensions like Live Server for VS code, etc. What are the advantages to using build tools instead?
Git here for reference:
Side bar, I was so close to making this animation work, but I got stuck. Any ideas? Iām so excited to be making things move I canāt even sit still.
1 Like
@Andre Amazing! The main advantage of using build tools is that you can author your code as ES6 modules. That repo has the build tools set up to generate bundle.js from ES6 modules.
I think Iāll use vanilla HTML in todayās session, to illustrate the option of not using any build tools.
Looks like you got the animation to work. Congrats! Very fun.
1 Like
I seeeeee thank you!!!
1 Like
Nice exercise. So I did set the Vizhub project https://vizhub.com/yiorgosbagakis/3697d057d58a40dc8b48b0e388bf46e2?edit=files
locally with Roller and then deployed it on a Github repository: https://github.com/yiorgosbagakis/worm-animation
here it is live on github pages: https://yiorgosbagakis.github.io/worm-animation/
Then I did a setup with Vite: https://github.com/yiorgosbagakis/vite-worm-animation
I used the Vanilla preset of Vite but I had to remove much of the initial files like the logos and the unused css. I kept their convention and renamed the index.js into main.js and imported the css file into it as well. Kept the vite favicon 
Amazing! Thank you for sharing.
Vite is an amazing tool and Iāve been using it for my proprietary work. I love the hot reloading feature most of all.
Iām thinking about modifying the VizHub export to use Vite out of the box, so it would be a great and familiar experience after you āejectā out of VizHub. The VizHub build system and Vite are very similar.