nassim-react

Nassim React Frontend

• Frontend for a stock trading app.
• See repo for code.
• See Nassim API for backend.

Stack

• Frontend: React, Redux
• Styling: React-Bootstrap
• Authentication: Passport.js, Google Sign-in, Facebook Sign-in
• Backend: Nassim API
• Database: MongoDB Atlas, Google Cloud
• Deployment: Heroku, Netlify, Travis CI
• Testing: Enzyme

Planning

• Data model and data flow diagrams
  • Data model
  • Data flow
• User flow and class diagrams - click tabs on the bottom to toggle between user flow diagram and class diagram
  • Buy and Sell mindmap
  • Buy
  • Sell
  • Sign up
  • Sign in
• Page mockups
  • Header and Footer
  • Home
  • Landing
  • Market View
    • grid view
    • list view
  • Stock
  • Transactions
  • Portfolio
  • Account

Setup

• Create React app
• Install npm modules
  • react-dom
  • react-router-dom
  • dotenv
• Set up common components
  • Header
  • Main
  • Footer
• Set up generic pages
  • Home
  • Landing
  • About
• Set up CSS library
• Set up Enzyme for testing

Wireframe

Core Components

• Auth
  • Register
  • Login
• General
  • Header
  • Main
  • Footer
• Home
• Landing
• Account
  • Email
  • Password
  • Cash
  • Assets
• Stock
  • Buy
  • Sell
• (Portfolio) - may be discarded
• Transaction

  Authentication

• Sign up
• Sign in
• Native register
• Native log-in
• Google sign-in - reference
• Facebook sign-in - reference
• GitHub sign-in
• LinkedIn sign-in

Notes

• See notes for external APIs and libraries.
• See redux.md for notes on Redux.
• see component-trees.md for notes on component trees.