Vision Talks

Project Planning

Overview

Vision Talks is lorem ipsum dolor sit amet. Phasellus dapibus fermentum risus vitae bibendum. Integer vel ipsum mollis odio sollicitudin ornare eu vel ex. In quis fringilla velit, ac maximus quam. Etiam eget placerat neque. Aenean faucibus sem non nisi lobortis ullamcorper.

Wireframes

Use the Wireframes section to display desktop, tablet and mobile views.

Desktop Landing

Desktop Body

Desktop Resource Index

Desktop Resource Show

Tablet Resource Index

Mobile Resource Index

MVP

The Minimum Viable Product should be a well-planned and easily-communicated product, ensuring that the client's deliverable will be achievable and meet specifications within the time frame estimated.

The Project Title MVP lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus dapibus fermentum risus vitae bibendum. Integer vel ipsum mollis odio sollicitudin ornare eu vel ex. In quis fringilla velit, ac maximus quam. Etiam eget placerat neque. Aenean faucibus sem non nisi lobortis ullamcorper.

Goals

Lorem ipsum, dolor sit amet,
consectetur adipiscing elit.
Phasellus dapibus fermentum risus vitae bibendum.
Integer vel ipsum mollis odio sollicitudin ornare eu vel ex.
etc.

Libraries

Use this section to list all supporting libraries and their role in the project.

Library	Description
Rails Documentation	Ruby on Rails Library.
React Router	React Router Library.
CSS Tricks	For help while styling web app.
StackOverflow	For help while writing functional and class components.
GIPHY	For videos used on Readme, loading spinner, and 404 page.
Surge	For deployment of front-end of web app.
Heroku	For deployment of back-end of web app.

Data

Use the Data Section to define the API(s) you will be consuming for your project, inluding sample URL queries.

API	Quality Docs?	Website	Sample Query
WeatherAPI	yes	example.com	example.com/mickeymouse?s=movies&t=10

Technologies Used

-Zeplin
-Sketch
-Figma
-draw.io
-Postman
-Google Fonts
-Giphy

Component Hierarchy

Use this section to define your React components and the data architecture of your app.

src
|__ assets/
      |__ data-tests
      |__ fonts
      |__ graphics
      |__ images
      |__ mockups
|__ components/
      |__ Header.jsx
      |__ Hero.jsx
      |__ Ipsum.jsx
      |__ Lorem.jsx
      |__ CTA.jsx
      |__ Footer.jsx

Component Breakdown

Use this section to go into further depth regarding your components, including breaking down the components as stateless or stateful, and considering the passing of data between those components.

Component	Type	state	props	Description
Header	functional	n	n	The header will contain the navigation and logo.
Navigation	functional	n	n	The navigation will provide a link to each of the pages.
Gallery	class	y	n	The gallery will render the posts using cards in flexbox.
Gallery Card	functional	n	y	The cards will render the post info via props.
Footer	functional	n	n	The footer will show info about me and a link to my portfolio.

Component Estimates

Use this section to estimate the time necessary to build out each of the components you've described above.

Task	Priority	Estimated Time	Time Invested	Actual Time
Add Contact Form	L	3 hrs	2 hrs	3 hrs
Create CRUD Actions	H	3 hrs	1 hrs	TBD
TOTAL		6 hrs	3 hrs	TBD

Why is this necessary? Time frames are key to the development cycle. You have limited time to code your app, and your estimates can then be used to evalute possibilities of your MVP and post-MVP based on time needed. It's best you assume an additional hour for each component, as well as a few hours added to the total time, to play it safe.

Helper Functions

Use this section to document all helper functions– generic functions that can be reused in other applications.

Function	Description
Capitalize	Lorem ipsum dolor sit amet, consectetur.

Post-MVP

Use this section to document ideas you've had that would be fun (or necessary) for your Post-MVP. This will be helpful when you return to your project after graduation!

Post-MVP Goals

Add user account and auth capabilities.

Post-MVP Data

Utilize the Giphy API to welcome new users with funny gifs.

Project Delivery

The Delivery section should be expanded and revised as you work on your project.

Code Showcase

Use this section to include a brief code snippet of functionality that you are proud of an a brief description

function reverse(string) {
	// here is the code to reverse a string of text
}

Code Issues & Resolutions

Use this section to list of all major issues encountered and their resolution.

Error	Resolution
`app.js:34 Uncaught SyntaxError: Unexpected identifier`	Missing comma after first object in sources {} object.

Installation Instructions For Local Machine

Link to deployed site (for quick reference while scrolling through readme file):

Surge(front-end): ()

Heroku(Back-end): ()

Sunnydayz77/visionTalks