Feli25 / lab-coffee-and-books

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Express | Coffee & Books

Learning Outcomes

This exercise will help you to:

  • Practice Google Maps API integration with an app
  • Add location properties in your models as GeoJSON
  • Display content from the Database in a map

cofee-book pic

Introduction

Books and coffee are two very compatible things. If you think about it, a nice cup of a hot beverage and a book are two amazing things to have together.

In this exercise, let's create an app to save both bookstores and coffee places and display them. You could even use Google Maps to display a path from one place to the other.

:::success :bulb: Hint: To accomplish this new challenge, feel free to follow the Google Maps & Express Learning Unit from the classroom :::

An up a running project

Remember you need to create a new project using ironhack_generator. Before starting, follow the next configuration guide:

  1. Install your project and dependencies
  2. Create the models folder to put your models.

Initial code: Coffee & Books CRUD

Begin by creating a simple CRUD. In this opportunity, you should have two different kind of places. Create a place.js file and add an attribute to set the kind of establishment.

  1. Create the model.
  2. Create routes to show the listed elements.
  3. Edit the index.js and the app.js with the routes to your model.
  4. Create the routes files and the views with the proper filesystem.
  • Add Location to Model
  • Add Location fields to form
  • Get Location & Save Places
  • Show Places in Map -figure out if you can set a difference among them
  • Get Google Maps API Key
  • Add Google Maps to index.hbs
  • The map
  • Add Markers to show places’ locations
  • The Show view

Summary

Now you know how to:

  • Add Google Maps to any application
  • Incorporate GeoJSON attributes in a Mongoose Schema
  • Display elements in a map with information from your apps Database

Extra Resources

About


Languages

Language:JavaScript 72.4%Language:HTML 23.4%Language:CSS 4.2%