Giter VIP home page Giter VIP logo

2111-grace-shopper's Introduction

Book-Shopper

Customize

Now that you've got the code, follow these steps to get acclimated:

  • Update project name and description in package.json

  • npm install

  • Create two postgres databases (book_shopper and book_shopper_test

  • By default, running npm test will use your test database, while regular development uses development database

Start

Sync and seed your database by running npm run seed.

Running npm run start:dev will make great things happen!

  • start:dev will both start your server and build your client side files using webpack
  • start:dev:logger is the same as start:dev, but you will see your SQL queries (can be helpful for debugging)
  • start:dev:seed will start your server and also seed your database (this is useful when you are making schema changes and you don't want to run your seed script separately)

Heroku

  1. Set up the Heroku command line tools
  2. heroku login
  3. Add a git remote for heroku:
  • If you are creating a new app...

    1. heroku create or heroku create your-app-name if you have a name in mind.
    2. heroku config:set JWT=<your secret here!> to set a secret for JWT signing

Database Setup

  1. heroku addons:create heroku-postgresql:hobby-dev to add ("provision") a postgres database to your heroku dyno (This creates your production database)

  2. heroku config:set SEED=true to get heroku to sync and seed your database

  3. note everytime your app restarts, the database tables will be dropped and re-created. To avoid this you can config:unset SEED

  • If you already have a Heroku app...

    1. heroku git:remote your-app-name You'll need to be a collaborator on the app.

Now, you should be deployed!

2111-grace-shopper's People

Contributors

cph2134 avatar kez-theo avatar galilior avatar ericpkatz avatar amandahenneberry avatar tstrat avatar sarahzhao25 avatar mmac1020 avatar

Watchers

 avatar

2111-grace-shopper's Issues

Admin/Login:

Front-End

  • Discuss with team: Either
    A) write a component that is a form that inputs Admin into the database
    B) write a special login page where a user can make themselves a user.
    **Possibly with a secret key.
    **for this requirement note User model contains userType with “admin” and “user” available to be toggled
  • This should make an AJAX request that changes userType in db

Backend

  • write routes to update user to admin

Single Book View:

view a single product so I can see more details.

For Frontend:

  • Display the appropriate book when the url matches the books name or id# (could be something like ‘/:book-name’)
  • Write a component to display a single book. This can include things like img, name, author description ect.
  • clicking a specific book from the many book view leads to that specific book
  • Add products to cart ← button

For Backend:

  • Write a route to serve a single book from db
  • Send somebody to single page view of the book

Admin - editing page

Frontend

  • Discuss with team: In terms of admin modifying data
    A)Write a component for a separate admin page that had book stock and user data an Admin can modify
    B)Once a user becomes an admin, toggle the regular product viewing page to edit
    **we could use both for different instances.
  • have full rights to make backend requests to add, edit, and remove products.
  • submitting a form or clicking on the button should make an ajax request that updates db
  • This might include writing a component to display a list of all users with whatever information you pick

Backend

  • Write a route to update an existing book
  • Write a route to update/delete an existing student

Checkout-User Data Form

***This would be extremely similar to the edit page, because it's pretty much the same form, but may contain the official checkout button.

Frontend:

  • Write a component that displays a form with data to input for the user to purchase (address, cc, phone number)
  • if the user has an account with that data, the appropriate fields should be pre-populated
  • Should make an ajax request to get user data to pre-populate the form
  • if the client is a user and does not have this data saved this should make an ajax request to save their data
  • Should contain a ‘checkout’ button

Backend:

  • write a route to update an existing user

User/Profile Slice

Frontend:

  • Login Form created already, can possibly edit

  • Submitting the form should add the user to the db

  • Create User/Profile component for user to enter associated shopping info (ie address)

  • User/Profile updating page should persist changed data to the database

  • Logged-in-user across multiple devices: I'm logged in on my mobile device and add some items to my cart. When I open the browser on my laptop and log in, I want to see those items in my cart.
    //if user<--->carts/profiles are associated properly this should work

Backend:

  • Write a route to add a user /profile to the db

  • Should be able to make changes to DB

  • model includes:
    firstName
    id
    lastName
    Email
    Password
    {Buyer info -> address, cc, phone number}
    cartId?
    Association-wise, a cart belongs to a user(then books would belong to the cart)

Home Page/Multi-Book Display:

view all available products so I can pick from a variety.

Frontend:

  • Write a component to display a list of many books
  • Write a book sub-reducer to manage book in your store
  • display the homepage component when the url matches /homepage

Backend:

  • Write a route to serve up many books
  • Book Model (may be created at this point)

Single User Page:

Single User view is not absolutely necessary. The only necessary thing for a user is to have a persistent cart across multiple devices, edit their cart, and make purchases.

Tier Two will require a purchase history and an edit functionality

Frontend

  • Display the student when url matches something like ‘/users/:id’ or ‘/:username’
  • page should display basic user details
    -[ ] write a component to display a single user
  • Link to the page with the edit functionality when one clicks an edit button
  • ??Possible past orders displayed??

Backend

  • write a route to serve up single user

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.