sdras / smashing

This was the result of a live code talk at Smashing Conf in Toronto, this is how far I got in 45 minutes

Home Page:https://smashingtoronto.netlify.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Smashing Toronto 2019 Talk

I live coded a Vue/Nuxt portfolio app in 45 minutes with layout and animation at Smashing Conf, here's the repo, and it was deployed to: https://smashingtoronto.netlify.com/

Video of the talk here! https://vimeo.com/348717993

Screenshot of Site

VS Code Extensions

I use my own VS Code snippets a ton in development to speed up my workflow/not have to type boilerplate.

I use my own Night Owl VS Code Theme

Both are in my Vue VS Code Extensionspack, which houses a lot of the extensions I use for development.

CSS Grid Generator

I used my CSS Grid Generator to create the grids I used for the layout.

Terminal Razzle Dazzle

I used Hub to create a repo from the command line.

I mentioned I'd share how I made my terminal fancy. For the colors: brew install lolcat

Then in .bash_profile:

export CLICOLOR=1
export LSCOLORS=gx

alias l='ls | lolcat'

Also the sparks are from Hyperpower.

Build Setup

# install dependencies
$ yarn install

# serve with hot reload at localhost:3000
$ yarn dev

# build for production and launch server
$ yarn build
$ yarn start

# generate static project
$ yarn generate

For detailed explanation on how things work, checkout Nuxt.js docs.

About

This was the result of a live code talk at Smashing Conf in Toronto, this is how far I got in 45 minutes

https://smashingtoronto.netlify.com/


Languages

Language:Vue 96.4%Language:JavaScript 3.6%