exPat Journal (Front End Code Base)

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.

Installing

A step by step series of examples that tell you how to get a development environment running cd into expat-journal folder and install dependencies with:

yarn or npm install

Then launch the development environment with:

yarn or npm start

Table of Contents

• Installation
  
• React Developer 1
  
• React Developer 2
  
• Product Vision Document
  
• Proposal
  
• UX Design
  
• Frameworks and Libraries Used
  
• Target Audience
  
• Research
  
• Prototype Key Features
  
• Credits
  

Overview

• Explicitly photos for traveling.
• More professional instagram.

Junior React Developers

Applied JavaScript	Intro-to-React	Single Page Application	TeamWork Capabilities	Form Managment

Senior React Developer

React Application	HTTP/AJAX	Sate Management	TeamWork Capabilities

---

Product Vision Document 🎉

exPat Journal

Minimal Viable Product (MVP)

1. User can visit site and see photos laid out in a grid
2. Travelers can create, read, update, and delete stories and photos. (No ability to upload one's own photos for MVP)

Stretch Goals (Keep in mind this project has to be accomplished in one week)

1. Build an image uploader into the site to allow users the ability to upload their own assets. (This will require some work with a package called Drop Zone and a service called cloudinary).

Proposal

• What problem does your app solve? *

• Be as specific as possible; how does your app solve the problem? *

• What is the mission statement?

  • Travel Far, Travel Often

Features

• What features are required for your minimum viable product?

  • User can visit site and see photos laid out in a grid
  • Travelers can create, read, update, and delete stories and photos. (No ability to upload one's own photos for MVP)

• What features may you wish to put in a future release?

  • Geolocation with photos/posts
  • Messaging/polling

What do the top 3 similar apps do for their users?

1. Main competitors are journal traveling/blogging apps

• Generally provide graphic or written content and the ability to share travel experiences and photos (social media platforms)

UX Design

• What design system will you use?
  • Figma Tool to build out wire frames for design and user flow, color pallete etc.
  • Styled Components

What is the URL to your wireframes?

• Figma Wireframe: https://www.figma.com/file/TmGCmqf9QuajGwMTgaaetC/Capture?node-id=266%3A800

• Tool to pick with : TBD
• Color palette choice: See figma...
• Type system: TBD
• Tool to reference: TBD
• Typography choice: TBD
• Icon system:

What will your user flow be?

Frameworks and Libraries

• What 3rd party frameworks/libraries are you considering using?

Frontend:

• Axios
• React
• React-router
• React-strap
• Styled Components
• Redux

Target Audience

• Who is your target audience? Be specific.

  • Travelers and bloggers

• What feedback have you gotten from potential users? *

• Have you validated the problem and your solution with your target audience? How? *

Research

Research thoroughly before writing a single line of code. Solidify the features of your app conceptually before implementation. Spend the weekend researching so you can hit the ground running on Monday.

Research material:

Prototype Key Features

This is the “bread and butter” of the app, this is what makes your app yours. Calculate how long it takes to implement these features and triple the time estimated. That way you’ll have plenty of time to finish. It is preferred to drop features and spend more time working on your MVP features if needed.

• App Landing Page (nav bar with login and register buttons).
• User Profile (all data needed about user)
• Register (email, password, submit)
• Login (email, password, submit)
• Edit User Profile
• Upload own images
• Database to store users, login and registration
• Ability to alter profile pic and information
• Ability to add a blog post, API to store posts. Seperate from Photos (Be aware of how CORS will be an issue)

Credits

Project Manager

Brandon Harris https://github.com/brandonharris177

Frontend

Alexis Davalos (senior react dev): https://github.com/alexisdavalos
Jeffrey Marte (senior react dev): https://github.com/
Anthony D Johnson (junior react dev): https://github.com/anthonyj713
Devoughn Halli (junior react dev): https://github.com/

Backend

Sumeya Ali https://github.com/sumeyaali
Andrew Ackerman https://github.com/ackers93