docs: 🔖 Release v1.0.0

README.md

@@ -1,26 +1,61 @@
-# Getting Started with Create React App
+# Introduction
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). It is my attempt to convert [this project](https://github.com/kentcdodds/bookshelf) into TypeScript and serves as a component for my résumé.
 
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+## Usage
+Visit the [live demo](bukshelf.netlify.app), register an account and let curiosity be your guide.
 
-## Available Scripts
+## Caveats
+For the main purpose of demonstrating React's modern best practices, the project uses [Mock Service Worker](https://mswjs.io) and Local Storage to emulate the backend's behavior, therefore, it won't match your expectations of a proper fullstack app.
+
+I'm still learning [TypeScript](https://react-typescript-cheatsheet.netlify.app/docs/basic/setup/) by building this project, so if you take a closer look, you'll see that I'm ignoring type checking at some of the non-critical parts of the app's functionality as well as a suppression for those cases where I have no clue of how to make TypeScript work *appropriately*. PRs are most welcome if you want to show me your approach to leverage TypeScript's power.
+
+All of the tests are passed, but there are still [`act()` warnings](https://reactjs.org/docs/test-utils.html#act) for some of them. I tried to fix that (and I failed, obviously).
+I highly doubt that there're some underlying dependency conflicts which may have been the cause. Again, if you happen to know how to deal with it, a PR is more than welcome.
+
+# Installation
+In case you want to run the app locally, make sure to have the same environment as I do to get it working properly. Please download and install these 2 softwares (if you don't have them already):
+1.  **nvm-setup.zip** from its [latest release](https://github.com/coreybutler/nvm-windows/releases)
+2.  [Git](https://git-scm.com/downloads)
 
+Then open up your terminal with **Admin privilege** and run the following commands:
+1. `nvm install 16.13.0` 
+2. `nvm use 16.13.0` 
+3. `node -v` (the output should be `v16.13.0`)
+4. Pick a folder of your choice, or create an empty folder and then `cd path-to-that-folder`
+5. `git clone https://github.com/HelpMe-Pls/bookshelf.git`
+6. `cd bookshelf`
+
+## Available Scripts
 In the project directory, you can run:
 
 ### `npm start`
-
 Runs the app in the development mode.\
 Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
 
 The page will reload if you make edits.\
 You will also see any lint errors in the console.
 
-### `npm test`
-
+### `npm t`
 Launches the test runner in the interactive watch mode.\
 See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
 
-### `npm run build`
+### `npm run cy:open`
+Run this command on a **separate** terminal instance **after** having your development mode running (with `npm start`) to launch the Cypress E2E test runner. It tests the user's "happy path" as follows:
+1. Arrive at the app and register.
+2. Go to the discover page and search for a book.
+3. Add that book to the reading list.
+4. Go to the reading list and then go to the book page.
+5. Add some notes.
+6. Mark the book as read.
+7. Give the book a 5 star rating.
+8. Go to the finished books screen.
+9. Verify the book shows up and has a 5 star rating.
+10. Click the book to go back to it's page.
+11. Remove it from the reading list.
+12. Make sure the notes and rating are gone.
+13. Go to the finished books screen and make sure that list is empty.
 
+### `npm run build`
 Builds the app for production to the `build` folder.\
 It correctly bundles React in production mode and optimizes the build for the best performance.
 
@@ -29,18 +64,15 @@ Your app is ready to be deployed!
 
 See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
 
-### `npm run eject`
-
-**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
-
-If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
-
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
 
-You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
+## Documentation
+To *quickly* learn React, check out the [React documentation](https://beta.reactjs.org/learn).
+For a paid course, I highly recommend the Kent C. Dodds [Epic React course](https://epicreact.dev).
+My personal preference [learning path](https://www.reactiflux.com/learning) to become a React Frontend developer.
+Check out [the notes](https://github.com/HelpMe-Pls/bookshelf/blob/master/WIL.md) that I had throughout the process of building this project.
 
-## Learn More
+# Contributing
+Pull requests are most welcome. For breaking changes suggestion, please open an issue first to discuss what you would like to change/improve.
 
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
+[Contact me](https://www.facebook.com/messages/t/100005341874318) if you need further support.
 
-To learn React, check out the [React documentation](https://reactjs.org/).

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bookshelf",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "private": true,
   "author": "Khoi Le <[email protected]> (https://github.com/HelpMe-Pls)",
   "license": "GPL-3.0-only",
@@ -127,4 +127,4 @@
   "msw": {
     "workerDirectory": "public"
   }
-}
+}

src/types.d.ts

@@ -41,23 +41,25 @@ export type BookProps = {
 }
 export type BooksList = BookProps[] | undefined
 
-export type CommonBook = {
-    bookId?: string
-    id?: string
-    title?: string | number
-    author?: string
-    coverImageUrl?: string
-    pageCount?: number
-    publisher?: string
-    synopsis?: string
-    loadingBook?: boolean
-    ownerId?: string
-    rating?: number
-    notes?: string
-    startDate?: Date | number
-    finishDate?: Date | number | null
-    book?: BookData
-}
+
+export type CommonBook = Partial<BookProps & BookData & BookResponse>
+//     {
+//     bookId?: string
+//     id?: string
+//     title?: string | number
+//     author?: string
+//     coverImageUrl?: string
+//     pageCount?: number
+//     publisher?: string
+//     synopsis?: string
+//     loadingBook?: boolean
+//     ownerId?: string
+//     rating?: number
+//     notes?: string
+//     startDate?: Date | number
+//     finishDate?: Date | number | null
+//     book?: BookData
+// }
 
 export type BookResponse = { book: BookData }
 export type ErrorResponse = {