The main goal of this application is to help users keep all information about their pets in one place, for example vaccination calendar, appointments time and list of medicines.
This app also provides a platform to create your own community of other pet owners and pets. Users can create a pet profile, upload some photos and share their memorable moments with others.
There are no obvious social media apps on the market specific for the pet owner, you can still use other services like Facebook, Instagram, Meetup and so on, but those are more focused on human lives instead of the pets. Therefore, pet owners end up join a private group for their meetups, sharing posts about their pets, and so on.
Succinctly, it's a social media for pet owners with some peripheral features which make it easy to keep track of details related to their pets health and wellbeing.
Please clone this repository and run these commands:
npm install or npm i or npm ci
cd client
npm install or npm i or npm ci
cd ..
npm run dev (To run both the server and the client at the same time)
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
colors This makes the console messages colourful so that we can catch things what's going on easily
dotenv With this package, I can load environment variables from a .env file into process.env.
express express is a framework of node.js which makes the job so much easier
express-async-handler Instead of using Promise .then .then .then, enables me to use async await for the back end.
jsonwebtoken We used JWT for user authorisation. Once the front end gets the response, stores the info to the localStorage to persist the login status.
mongoose Mongoose is a MongoDB object modeling tool designed to work in an asynchronous environment.
concurrently Run multiple commands concurrently.
nodemon nodemon is a tool that helps develop Node.js based applications by automatically restarting the node application when file changes in the directory are detected. Redux and Redux Toolkit In order to use Redux, using Redux Toolkit is strongly recommened by the Redux developers that is stated on the documentation. Redux Style Guide
axios Promise based HTTP client for the browser and node.js
daisyui daisyui is a tailwind CSS plug in that makes us to use their existing components, so that for normal situations, I can still use tailwind CSS utility classes to create my own component, and then go for daisyui when I need some components.
React Icons React Icons for using svg icons.
React Toastify This is to have a little toast message to notify users.
react-router-dom This is for react routing.
TypeScript For more secure, less error prone working environment. (However, we used lots of "any" to just get things done).
We followed MVC pattern for the application. We have our frontend (react) as view and have separate controllers for each model. We created models for each too.
We chose agile methodology with kanban framework over scrum since we only had 2 ~ 3 working days. No sprints needed, we just created a big kanban board on Trello. The link is below:
Trello Board
Snapchat