Stay Gold, Cowboy

Server-Side: Python Django

• server side code

Topics

• Overview
• Get Started
• MVP Features
• Video Walkthrough of MVP
• Relevant Links
• Code Snippet
• Project Screenshots
• Tech and Frameworks Used
• Future Features
• Contributors

---

Overview

• The ideal user for Stay Gold, Cowboy is a fan of Sonatore
• Fans can sign in with Google authentication and upload their favorite image URLs of Sonatore's art
• Fans can organize the artwork by tags

Get Started

1. Create a Firebase project and set up authentication. Use these videos as a refresher if needed.
2. Clone Stay Gold, Cowboy to your local server

[email protected]:AngieMGonzalez/staygoldcowboy-client.git

1. Create a Firebase project and set up authentication.
2. Create a .env file at the root of the project
3. Copy/Paste the contents of the .env.sample file to your newly created .env file.
4. Copy the environmental variables from Firebase and paste them as the properties of the keys found in your newly created .env file
5. Clone and set up the server side code to your local machine
6. Open the package.json file and change the name property to the name of your application, and author to your name.
7. From your command line, be in the root directory and run npm install OR npm i for short.
8. Next, run npm run prepare. This command sets up husky to track eslint errors on commit that will make your deploy fail on Netlify
9. To start Stay Golden, Cowboy, run npm run dev to run your development server
10. Open http://localhost:3000 with your browser

MVP Features

• Fans of Sonatore sign in with Firebase Google authentication
• Fans can browse all the art and all the tags
• Fans can create, read, update and delete art and tags
• Fans can create read update and delete their own snippet ideas
• Art has information regarding creation date, tags, and image url
• Fans can filter art by tags

Video Walkthrough of MVP

• https://www.loom.com/share/c0f3bf90f50745d586bc2de0fa3b7ca2?sid=aca90b99-db81-4120-8330-390c45d06ba6

Relevant Links

• Figma Wireframes for MVP
• Project Board

ERD

• MVP ERD made with dbdiagrom.io

• Assumption: Art can have many tags, and tags can be associated with many pieces of art

Code Snippet

Set PropTypes for MVP

ArtForm.propTypes = {
  artObj: PropTypes.shape({
    id: PropTypes.number,
    title: PropTypes.string,
    image_url: PropTypes.string,
    creation_date: PropTypes.string,
    tag: PropTypes.arrayOf(PropTypes.shape({
      id: PropTypes.number,
      medium: PropTypes.string,
    })),
  }),
};

MVP Project Screenshots

Tech and Frameworks Used

Future Features

• only fans will be able to edit their own uploaded work
• only admins will be able to delete artwork

Contributors

• A.J. Gonzalez
• Badges from Alexandre Sanlim and Profilinator
• React/Next.js Django Auth template from Nashville Software School
• Thank you C62