Build a Web Scraper with Node.js and cheerio – IMDB Movie Search



Show starts at 0:48 ? See the description below for more timestamps.
Server code is here: https://github.com/w3cj/imdb-scraper-server
Client code is here: https://github.com/w3cj/imdb-scraper-client

– [1:12] Introduction
– Set up server folder
– [3:42] initilize a node app
– [3:57] npm install node-fetch
– [4:26] How to use node-fetch
– Parsing HTML with cheerio
– [6:49] Overview of cheerio
– [7:18] Add cheerio to server code
– [7:39] Get movie titles and movie posters from IMDB search :tada:
– Start using express
– [11:53] Format data as JSON
– [13:04] Prepare code for modularity
– [14:12] Create a basic express app
– [15:39] Create node scripts (auto-reload with nodemon)
– Building an API in express
– [16:31] Create search route
– [18:02] Get movie id from IMDB
– [20:12] Create movie route
– [23:19] Get data from IMDB movie page
– [23:25] Title
– [26:39] MPAA Rating
– [27:59] Run time
– [29:58] Genres
– [31:45] Release date
– [32:50] IMDB rating
– [33:40] Movie poster
– [37:04] Summary
– [38:03] Directors
– [43:24] Writers
– [46:52] Actors
– [49:32] Story line
– [51:50] Things to keep in mind when scraping the web
– [53:10] Back to getting data from IMDB
– [53:10] Try getting budget
– [54:09] Production companies
– [57:46] Link to trailer (Part I)
– [1:00:49] OUTDATED suggest videos via pollly (view top of description)
– [1:01:21] Link to trailer (Part II)
– [1:03:40] Add caching
– [1:07:16] Deployment via now
– Create Frontend in Vanilla JS
– [1:09:45] Add CORS to server code
– [1:11:11] Create client folder
– [1:11:42] Add Bootswatch CDN
– [1:12:21] Start styling
– [1:15:50] Add search logic
– [1:18:58] Show search results on page
– [1:23:04] Create movie page
– [1:41:52] Format date with date-fns
– [1:46:04] Review of what we have built today!
– [1:51:42] OUTDATED. Please use https://poll.coding.garden/
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Build a real-time question/answer app with FeathersJS – Part 2



Show starts at 2:07
This episode Chad is back to pair with me!
We’ll be working on the app we started in this video: https://www.youtube.com/watch?v=O5A1GAWBV8s
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Newby Tuesdays – Build a Desktop Clipboard History Manager with Electron



Show starts at 1:44
Code is here: https://github.com/CodingGarden/clipboard-elephant
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

What is Application State? – Build a Movie search app with Vanilla JS and Vue.js



Show starts at 0:48
https://github.com/CodingGarden/application-state
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Build a De-Coupled Full Stack JavaScript CRUD App with Node/Express/Postgres/Knex/jQuery/Bootstrap



# Build a De-Coupled Full Stack App: CRUD todo

We’ll be using:
* Server:
* postgres for our database
* knex.js for our database migrations, seeds and queries.
* express.js for our JSON routes
* Client:
* jQuery for DOM/AJAX
* boostrap for our UI

The code is here: https://github.com/w3cj/Full-Stack-JavaScript-CRUD/tree/part-3-de-coupled

## Full Stack Check List
* 1:54 Add api folder and create/mount router
* 6:09 List all records with GET /api/v1/todo
* 21:26 Add Bootstrap
* 24:52 Show new form in new.html
* 26:40 Create a record with POST /api/v1/todo
* 42:25 Show one record with GET /api/v1/todo/:id
* 55:30 Show an edit form in edit.html?id=42
* 1:04:35 Update a record with PUT /api/v1/todo/:id
* 1:18:17 Delete a record with DELETE /api/v1/todo/:id
* Redirect on create / update / delete
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Build a Brick-Breaker game with P5.js – Special Guest Brooks Builds



Show starts at 1:25
You can see the code here: https://github.com/CodingGarden/p5-brick-breaker
Play the game here: https://brick-breaker.now.sh/
Checkout Brooks Builds here: https://www.youtube.com/channel/UCT1-XRVnJA-wws2bfbLbFcQ
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Build an Interactive CLI Tool with Node.js



Code is here: https://github.com/CodingGarden/now-config
View on npm: https://www.npmjs.com/package/now-config

? Donate: https://coding.garden/donate
? Pledge: https://coding.garden/pledge
? Discord: https://coding.garden/discord
? Stickers: https://coding.garden/stickers
? Gear List: https://coding.garden/gear
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Breakout: Build an Angular 1.6 Todo App



https://github.com/w3cj/AngularTodo
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Newby Tuesdays – Build a Weather App with Vue.js and Bootstrap



Show starts at 2:25
Code is here: https://github.com/CodingGarden/vue-weather
Resident Newb Tony will be back to build a Weather App with Vue.js and Bootstrap. We will be using the DarkSky Weather API.
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

Coding Garden Kickoff – Build a Full Stack JavaScript Application Part 1



Checklist is here: https://gist.github.com/w3cj/449d54c8d10f931706fddeb3562e0a84
Client code is here: https://github.com/w3cj/product-CRUD-client
Server code is here: https://github.com/w3cj/product-CRUD-server

* [2:34] Setup client folder
* [2:38] index.html
* [2:55] Add bootswatch CDN
* [5:33] Create index.js
* [6:09] git init
* [6:31] Create a server folder
* [6:52] Generate Express App
* [7:38] git init
* [8:03] Convert Express App to JSON API
* [9:05] Remove view rendering/views folder
* [9:35] Remove routes folder
* [10:01] Remove static serve and public folder
* [10:37] Update error handler
* [10:42] Add GET / endpoint
* [13:00] Client: Try to make a request
* [14:13] See the CORS error and remember this moment
* [15:53] Add CORS to the API
* [18:19] Create database
* [19:02] Initialize knex project
* [19:02] Install knex and pg
* [19:24] Create knexfile.js
* [20:58] Create product table migration
* [25:43] Seed product table with sample data
* [28:43] Add api folder and create/mount router
* [32:54] Connect to the database
* [33:11] Create database connection file
* [35:53] Create a queries file
* [36:55] List all records with GET /api/v1/products
* [37:36] Create query
* [38:09] Create route
* [39:36] List all records in /index.html
* [39:51] AJAX Request to GET /products
* [40:28] Append to DOM
* [46:32] Each product links to /product.html?id=:id
* [47:31] Display a link to /create.html
* [50:37] Show one record with GET /api/v1/products/:id
* [51:16] Validate id
* [52:51] Create query
* [53:25] Create route
* [55:27] Show one record in /product.html?id=:id
* [55:54] Parse query string to get id
* [58:41] AJAX Request to GET /products/:id
* [1:00:53] Append to DOM
* [1:03:30] Display link to /edit.html?id=:id