dimitermusic / petit-frontend Goto Github PK

Dimiter: Intro/concept/problems solved - 60s
Jonathan: Demo - 5min
Kellie: Google API, Issues Encountered - 45s
Charlotte: Cloudinary, Future Dev - 45s

• Shows place name and features depending on if job or establishment (has pet menu, has pet stipend)
• Place has badge showing job or establishment
• Each feature has up and down votes
• Comments section with all comments for particular place
• Places page populates with place information from result that was clicked

• Ability to refresh place and discover place
• Combining place and discover place
• login and signup separate components
• Add favicon and meta og:image tag to index.html
• Edit and delete comments
• Delete vote on second click
• Change color of vote when voted
• Vote created at click of thumb rather than at click of result
• Show list of places contributed to in profile
• Ability to see other user profiles
• Alerts to modals
• user settings
• reactions to comments
• media query on signup for all mobile devices
• email reminders
• logo with white fill and green eyes
• remove box shadow from badges (looks weird in dark mode)
• When no results, show “no results”

• Badge (conditionally rendered based on amount of votes: petit pup=0-24 votes, petit best friend=25-99 votes, petit whisperer= 100+ votes)
• Username
• Picture
• Votes (how many vote ids are in db for user)

• Login
• Discover
• DiscoverPlace
• Profile
• Place
• Results

• Finalize format and keys
• Build Models
• Build Seeds/NPM Google Places API

https://drive.google.com/file/d/1_Gl1mc4lbWj2U-COvvY_ryKSsNTcx0zA/view?usp=sharing

Fetch location details upon user query from two separate bars "name" and "location" and plug into link below:

https://maps.googleapis.com/maps/api/place/textsearch/json?query={NAME}%20{LOCATION}&key=AIzaSyBKNj8GErEiXmaxc13FyYgl7X8tngQIHNM

• "/" renders home and nav component (nav is on every page). Home component contains login/signup components
• "/profile" renders profile component with user id of logged in user.
• "/discover" renders discover component.
• "/place/id" renders place component with place id of place that user searched for.

• We expect whatever you build to have utility.
• We expect you to have market or real-world research that evidences your idea
  has REAL value to people.
• We expect you to have done research on other web/mobile applications in your domain.
• We expect you to put serious time and thought into this.
• We expect you to report problems you are facing along the way.
• We expect you to utilize some form of project management system.
• We expect you to dig deep into documentation and external resources to learn what you need.

• Login Component
• Signup Component

• Before signing up, able to go to discover then a place instead of hitting alert
• When updating profile photo, doesn't update until refreshed or link hit again
• Kellie minifying of js and eliminating errors (cleanup) to be pushed (Kellie)
• Individual search results not populating (google API issue) (Dimiter & Kellie)
• Conditional rendering rendering for vote features needs to done for DiscoverPlace (Jonathan)
• onClick and <textarea> changed to onSubmit and <input> in DiscoverPlace (Dimiter)
• Padding on bottom of Discover and Results (Dimiter)
• Reverse comment array in displaying comments on page load in addition to when posting comment in DiscoverPlace (Dimiter).
• Commenting functionality for DiscoverPlace (Kellie)

• Must have a folder structure that meets the MVC paradigm
• Must meet good-quality coding standards (indentation, scoping, naming, etc.)
• Must utilize at least one new, library, package, or technology that we haven’t discussed
• Must have a front end/UI built on React
• Must have both GET and POST routes for retrieving and adding new data
• Must be deployed using Heroku (with data)
• Must use a Node and Express web server
• Must be backed by a MySQL/Sequelize or Mongo/Mongoose database
• Must protect API keys in Node with environment variables

General pointers for project presentations

• PRACTICE

  • Literally run through, time, adjust timing to fit guidelines.
  • If you haven’t actually given the presentation flawlessly at least once, you should practice more.

• Only 1 (one) person should screen share

  • One team member should do this for the entirety of the presentation.
  • This should usually be the person doing the demo.
    • Run the deck while others/self talk.
    • Give demo
    • Run deck while others/self talk.

• Outline of proper presentation order/timing:

  • — 60-90 seconds —
    • Elevator pitch/concept/problem solved
  • — about 5 min —
    • demonstration of app
  • — 60-90 seconds —
    • tech used, issues encountered, future dev
  • — 2-4 min —
    • questions

• Lists 10 seeded locations
• Badge showing if reviewed as a job or establishment
• Search bar for user to input business name and location
• Search component with different locations after user search

• render from db
• hit correct routes
• make votes state work

Conditional logic checking for user's vote on particular feature (ex: on click false, if true, put or update to false)

• Get/Post/Put/Delete all and by id routes for Users
• Get all and by ref_id routes for Places
• Get/Post/Put/Delete all and by id routes for Comments
• Get/Post/Put/Delete all and by id routes for Votes
• Get/Post/Put/Delete all and by id routes for Reactions