/ga-mern-project-frontend

Primary LanguageJavaScript

Tweeper - Frontend

A Twitter like clone application with the ability to read, create, delete and update "Tweeps". Additionally, users can comment on others "Tweeps".

Planning and Design

App Plan

  1. Design Twitter like app
  2. Incorporate Jest for unit testing
  3. Build Full CRUD (Create, Read, Update, Delete) capability with interface
  4. Seperate backend and frontend into different github repos
  5. Have two non-user models
  6. Use MongoDB as NOSQL database

Front End Requirements

  1. Use React Router
  2. Use react
  3. Use Axios
  4. Use component library with Storyboard
  5. Create Axios API

Minimal Viable Product (MVP) / Tier 3 / Tier 2/ Tier 1

Tier 3 (MVP)

  • Populate Interface with mock data that is read only, which shows the tweeps of multiple users on their profiles
  • CRUD Ability for Users, and CRUD for tweeping
  • CRUD for Users, CRUD FOR Tweeping, and CRUD for commenting

Tier 2

Bronze:

  • View profile of others
  • Add Followers

Silver:

  • Add profile pictures

Gold:

  • Add "like" button

Tier 1

Bronze:

  • Send pictures as tweep

Initial Design Layout

tweeper-mock

TweepStream

Features

  • Users can create "Tweeper" accounts
  • Users can login into their individual accounts
  • Users can create, delete, and manage their own "Tweeps"
  • Users can add, delete, and mannage their own comments

Technologies Used

  • React
  • Hygen
  • Jest
  • Axios
  • Storybook
  • Netify

Installing

Backend: https://github.com/clarknoah/ga-mern-project-backend

  • Install MongoDB
  • Run MongoDB
  • Seed backend server data

Frontend: https://github.com/clarknoah/ga-mern-project-frontend

  • Git clone
  • npm install
  • npm run Start

Running the tests

  • npm test

Deployment

Front end: Netlify https://cranky-sammet-bc7140.netlify.com/

Authors

Noah Clark - Full Stack / Deployment

Jenna Dean - Backend / Design

Josh Neves - Design / Project Management

Acknowledgments

  • Inspiration - Twitter