Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/juliankrzysiak/tometracker
A simple book list for anyone to use
https://github.com/juliankrzysiak/tometracker
book tracker
Last synced: about 1 month ago
JSON representation
A simple book list for anyone to use
- Host: GitHub
- URL: https://github.com/juliankrzysiak/tometracker
- Owner: juliankrzysiak
- License: mit
- Created: 2023-04-11T03:01:00.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-25T22:57:25.000Z (9 months ago)
- Last Synced: 2024-05-11T23:23:09.985Z (9 months ago)
- Topics: book, tracker
- Language: TypeScript
- Homepage: https://tometracker.pages.dev/
- Size: 521 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
## About The Project
Desktop | Mobile
-------------------------|-------------------------
| 
### Built With
### Features
- Track books you've read.
- Save book rating, time spent reading, and your reviews.
- Choose which image you want for your book.
- Filter and sort your books.
### How It's Made
This was one of my first big projects I made by myself.
I made a typical CRUD app using React and MongoDB. I used Redux ToolKit for all the global state management, which was great to use after learning barebones Redux.
I went back and completely redid the structure of the project so it could be more easily understood and scaled.
For a first project, I'm happy with how it turned out.
### Optimizations
- I refactored a lot to cut down on the unnecessary usage of global state management, which came mainly from introducing routing.
- I liked using typescript for the backend. While annoying, it helped with stability in the long-term.
- I updated the project structure of the frontend, a complete overhaul for the better, namely implementing features.
- I also redid the API a bit, since I was calling it too many times when once would have sufficed.
### Learning Outcomes
| The Good | The Bad | The Ugly |
|----------------------------------------|------------------------------------------------------|----------|
| My first big project! | Didn't utilize routing from the start | Made a whole function for focusing when I could have jsut used autofocus |
| Utilizing a UI library to help move things along | CSS could be improved in places | |
| Refactored the project structure | Not enough error handling | |
| Implemented a queue for toasts | | |
| Refactored away much global state management | | |
## Getting Started
If you want to get a local copy running, here ya go.
### Prerequisites
* pnpm
```
npm install -g pnpm
```
### Installation
1. Clone the repo
```
git clone https://github.com/CastillejaCode/tometracker.git
```
2. Install NPM packages
```
pnpm install
```
3. Run tow local development servers
```
cd client && pnpm dev
cd server && pnpm dev
```
I should really add a master package.json, for now it's pretty much two different repos you have to start individually.
4. Switch out my info for yours
Add your MONGODB env variable in the server, and change the client's base url to localhost:3000.
And of course you'll need to have the same exact schema in your MongoDB, so have fun with that.
## License
Distributed under the MIT License. See `LICENSE.txt` for more information.
## Contact
Julian Krzysiak - [email protected]
Project Link: https://github.com/CastillejaCode/tometracker
## Acknowledgments
* Favicon generator - [favicon.io](https://favicon.io/)
* SVG Icons - [Hero Icons](https://heroicons.com/)
