No description, website, or topics provided.
Clone or download
Latest commit dae65ff Feb 14, 2020
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
controllers changes Feb 14, 2020
models changes with solutions Feb 14, 2020
node_modules readme file Feb 13, 2020
views changes with solutions Feb 14, 2020
.DS_Store changes Feb 14, 2020
create.hbs changes with solutions Feb 14, 2020
package-lock.json changes Feb 13, 2020
readme.md changes Feb 14, 2020
server.js changes Feb 14, 2020

readme.md

express-views-exercise Objectives Creating a UI for interacting with HTTP controllers Practice using handlebars syntax. Your web page will need to:

Setup download the express-intro-exercise solution directory. rename the directory to express-views-exercise cd int onto that directory. npm install mkdir -p views/shops (this will create the views/ and views/shops/ directories at the same time) touch ./views/shops/shops.hbs ./views/shops/shop.hbs ./views/shops/create.hbs Uncomment the line app.use(express.urlencoded()) in server.js Testing your changes Open a web browser and go to localhost:3000/ to test a specific page.

NOTE: Every time you update any file in controllers/ or models/ you will need to stop and restart your server.

List Shops Page Write handlebars template HTML views/shops/shops.hbs to list the names of all the shops using {{#each}}...{{/each}}

For each name render an ... where ... should be replaced with handlebars template that will display the name of a shop. (see @index documentation)

in controllers/shops.js modify the .get('/shops' route to render the shops/shops template. You will need to do the following:

replace res.send with res.render set the context (2nd argument to res.render) to {shops: <results from calling getShops()>} Create Shops Form Write handlebars template HTML views/shops/create.hbs to display a Web form for creating a single shop. Follow the template create form. Make sure to set the action attribute to /shops. This will perform a POST request to /shops when the submit button has been clicked.

In controllers/shops.js modify the .get('/shops/new' route to render the shops/create template. You will need to do the following:

replace res.send with res.render set the view path (1st argument to shops/create) which points to views/shops/create.hbs set the context (2nd argument to res.render) to {shop: <results from calling getShop(req.params.index)>} In controllers/shops.js modify the .post('/shops') route to redirect /shops/. To do this you will need to replace res.send with res.redirect. See the (res.redirect docs for details).

View and Update Shop Page Follow the same steps for Create Shops Form where:

views/shops/shop.hbs as the template file and template edit form for the content. This will render a web form to display the data for a single shop as well as provide a webform for updating this information. /shops?_method=PUT as the form action In the controller modify .get(/shops/:index route to render the shop.hbs view (in other words use shops/shop as the view path) Delete Shop Form Following the same pattern above. Add a webform that

has a single input field for a submit button. When submitted the form should make a POST request to /shops?_method=DELETE which will trigger the .delete( route which will call the deleteShop API function. in the .delete( function redirect to the /shops route.