Skip to content

Alynn022/lynns_list

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Lynn's List

Table of Contents

Overview

This is a group project incorporating a new stretch tech, TypeScript. "Lynn's List" is an application for users to maintain and keep track of what restaurants they have been to, want to visit, and/or add to their personalized list. When a user first lands on the home page, they can view a list of individual restaurant information. A user is then able to create their own lists to add specific restaurants to. The user can also view more information about each restaurant by following the Yelp link for that restaurant. This application utilizes the Yelp Fushion API to bring the latest information on restaurants in Denver.

Deployed site

https://lynns-list.herokuapp.com/

Screenshots

Home Page View

A user can view a list of 50 restaurants by default.

home-view

A user is able to request to load more restaurants.

load-more

A user is able to add a restaurant to one of their lists and then navigate to "My List's" to view the restaurant they saved.

add-to-list-view

A user is able to view other lists, "Loved It", and then click home to go back to the main page.

home-button

A user is able to create their own list and then add restaurants to that list.

create-new-list

Application has responsive layout for mobile view or browser view.

responsive-layout

Application has a 100% Lighthouse Accessibility Score.

Accessibility-Score

Joint Learning Goal

Our learning goal was to build this application using a new technology that none of us had previous experience with. We chose TypeScript.

Individual Reflection

Ali - My goals were to learn how to work with a strongly typed language, continue gaining experience with React functional and class components, and to make our app dynamic based on user input.

Daniel - My primary learning goal over the course of this project was to gain an understanding of strongly typed languages via Typescript. I also wanted to continue transferring the staples I learned in VanillaJS to React.

Jani - My learning goals included incorporating TypeScript into React, understanding how to refactor class components into hooks, and potentially stretching into React Styled Components.

Lynn - My learning goals were to do more cypress testing using intercepts and stubbing static data. I also wanted to be more familiar with class and functional components in TypeScript, and with this project, to understand when it was better to use one over the other.

Future Enhancements

  • Add more cities for users to view restaurants for.
  • Add filters for users to sort through types of restaurants.
  • Add a search bar for users to search by name.
  • Allow users to remove or edit a list name.

Install and Setup

  1. Clone this repo git clone [email protected]:Alynn022/lynns_list.git
  2. Install the necessary package dependencies npm install
  3. Run the command npm start
  4. Start the server at http://localhost:3000/

Project Spec and Rubric

Turing School of Software & Design - Stretch Tech Project Spec

Contributors

Contact Us on LinkedIn

Technologies

  • TypeScript
  • React
  • React Router
  • Cypress
  • JavaScript
  • HTML
  • CSS/SASS
  • Git
  • Figma
  • Webpack
  • Fetch API

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •