Anything in any way beautiful derives its beauty from itself and asks nothing beyond itself. Praise is no part of it, for nothing is made worse or better by praise. -Marcus Aurelius
Iro is a simple project built by me (Caleb Cyphers) for my third module final project at the Turing School of Software and Design. The project was to be a simple website that reaches out to an inspirational quotes API called 'QuoteGarden' and allows the user to find and save quotes that they like for use in journaling, scrapbooking, etc.
I'm taking this project as an opprotunity to re-affirm and streamline my workflows, all the way from the ground up. This will include:
- Foundational planning
- UX flow planning
- Typechecking with PropTypes
- Wireframing
- Consistent Github workflow
- Consistent React architecture
- Clean routes with react-router
- Consistent TDD (Test Driven Development) using react-testing-library
- Consistent TDD using Cypress
- Design of clean, workable UI
- React Hooks
- Prop destructuring
The repo was made using create-react-app and has not been deployed, so in order to view it:
- Clone it down to a local machine, then
cdinto the repository and runnpm install - Once the installation is complete, run
npm startto spin up the development server. - To view unit tests, run
npm test - To view Integration Tests, run
npx cypress open
The site is a simple one. On the homepage, the user is greeted by a random quote from the api, along with four buttons.
The 'My Quotes' page will show a small error handling message until the user saves a quote from the homepage. When the uer finds a quote they like, they can click the 'save' button on the homepage. The quote will now show up on the My Quotes page. Duplicate quotes will not be saved.
The CSS of this app is responsive and designed to allow it to be experienced on many shapes and sizes of screen.
Quotes Api:
Testing:
Caleb Cyphers
