Everyone has bad days…PickMeUp is an application that provides an uplifting compliment and/or a solid piece of advice to put a smile on your face! Users have the opportunity to browse through a variety of compliments/advice as well as favorite their most liked!
The stretch technology we chose as a group was TypeScript. TypeScript is an increasingly popular programming language and many employers are seeking TypeScript experience. The key augmentation TypeScript brings to JavaScript is a type system (hence the name “TypeScript”). Below are just a few benefits of using TypeScript in React:
- Readable, easily understandable code
- Interfaces
- Better support for JSX
- Easier debugging while writing code
Throughout this project, we took full advantage of React’s modular nature by creating dynamically rendered components and views. This helped us keep the app small yet provided the user with a pleasant experience. We implemented thoughtful architecture through the use of shared utilities, global extendable interfaces, and views. We implemented Local Storage to store our favorite compliments and pieces of advice.We styled the app using shared classes that reduced the amount of repeated CSS throughout the app as well as applying media queries to make everything mobile responsive. We recognized the value of typescript while working through the functionality and feel confident in the product we created.
- Continue to gain competency with React Fundamentals
- Create a multi-page UX using Router
- Practice refactoring
- Continue to learn how to test React components & asynchronous JS
- End to end testing with Cypress
Our application includes the following core functionality:
- Displays the data from the API in a way that applies directly to our audience
- Ability for users to store/manipulate the data displayed in the application, such as favoriting and un-favoriting and storing favorites in Local Storage
- Multiple views handled by Router
- App deployment using Heroku
- JavaScript
- TypeScript
- React
- React Router
- HTML
- CSS
- Cypress
- Mocha
- Chai
- Fetch API
- NPM
- Webpack
- Heroku
Future features could include:
- Add functionality to allow a users to add/post personalized compliments or advice
- Add feature to connect with other users and send compliments or advice
- Include images or music to enhance user experience
- Fork and clone this repository
- Cd into the root directory and run
npm i - To run this server, run
npm startin the terminal and React will start the development server. To stop the local server, use commandControl + C. - Open a browser window and go to http://localhost:3000 to view the website
Rachel Allen
Lourdes Benites
Lidia Karpinski