Skip to content

kylomite/little-shop-fe

 
 

Repository files navigation

Little Shop

Abstract:

  • Little shop is an e-commerce web site designed to host merchants with items for sale. This site allows for displaying merchants, displaying items for sale, and displaying any given merchant's items. We can also use the site to add new merchants to our merchant list.

Installation Instructions:

  • Fork this repo, as well as our BackEnd Repo
  • cd into BE repo in terminal
  • Install all gem dependencies by typing bundle install in the terminal
  • Initialize database by typing rails db:{drop, create, migrate, seed}, followed by rails db:schema:dump in the terminal
  • Begin API by typing rails s in the terminal
  • cd into FE repo in terminal
  • Run npm install in terminal
  • Run npm run dev to start vite.
  • Project has opened at "http://localhost:5173/"

Preview of App:

Context:

(Give some context for the project here. How long did you have to work on it? What specific work/improvements did you contribute to this FE application?)

  • We spend a majority of our time on the backend with this project. We started working on the front end towards the end of our work time, and we worked approximatley 12 hours. We improved the front end logic by utilizing Javascript iterators, styled the page to include custom images, colors, and micro animations, and we included data validation for editing merchants.

Contributors:

Learning Goals:

  • Learning Goals:
    • We gained experience with error handling in several different contexts.
    • We learned about the communication between the front and back ends when building a full stack project.
    • We navigated one to many relationships present in our database.
  • Tech/Tools:
    • We used Ruby on Rails to develope our backend API.
    • We used the Factory-bot, Faker, SimpleCov, Rspec, ShouldaMatchers and Rack-Cors gems for our development process.
    • We used Postman to test our endpoints for HAPPY and SAD paths.
    • We used Github Projects to manage our progress and developement.
    • We used dbDiagram to visualize our database relationships.

Wins + Challenges:

  • Wins:
    • We navigated a project with complex needs requiring coordination, and communication. By utilizing these skills we were able to work efficiently, without interfering with each other's work.
    • We worked effectively through different avenues of development including, driver-navigator, mob-coding, and independent coding all while remaining aware of our work's impact on our groupmates, and vise-versa.
    • We were able to implement tech and tools that required independent research for proper usage.
  • Challenges:
    • We faced a developement setback over the weekend, where half of our team was unavailable to work for a significant amount of time due to sickness, and prior commitments. We were able to stay on track with our progress due to clear communication of expectations moving forward and the willingness of all parties to contribute based on their ability.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 65.4%
  • CSS 20.6%
  • HTML 14.0%