This is a full-stack animal adoption application built with React, TypeScript, Redux, and Vite on the frontend, and Node.js, Express, and PostgreSQL on the backend.
- User Management: Users can register, log in, and manage their posted animals.
- Animal Listings: Users can upload animals available for adoption, including images and details.
- Animations: Smooth UI animations powered by
@react-spring/web. - Markdown Support: Use of a markdown editor for rich-text content with sanitation for security.
- Routing: Dynamic routing for navigating between pages using
react-router-dom. - State Management: Efficient global state management with
@reduxjs/toolkit. - Form Handling: Axios is used for form submissions and API interactions.
- File Uploads: Handle image uploads using Multer.
- Input Validation: Express-validator for request validation.
- Authentication: Secure JWT-based authentication with bcrypt for password hashing.
- Responsive Design: Styled with TailwindCSS for a mobile-friendly and responsive design.
- React, TypeScript, Vite
- Redux for state management
- React Router for routing
- TailwindCSS for styling
- Axios for HTTP requests
- @react-spring/web for animations
- Markdown Support:
react-md-editorandreact-markdown
- Node.js, Express, TypeScript
- PostgreSQL database
- JWT Authentication with
jsonwebtokenandbcrypt - File Uploads with Multer
- Validation using express-validator
- Testing setup with Jest, Supertest, and pg-mem for database testing
Ensure you have the following installed:
- Node.js (version 14+)
- PostgreSQL
- Clone the repository:
git clone https://github.com/paluras/adoptProject.git- Navigate to the project directory:
cd animal-adoption- Install frontend and backend dependencies:
cd frontend/animal-adoption
npm install
cd backend
npm install- Set up environment variables for both the frontend and backend. Copy
.env.exampleto.envand configure the database and API credentials.
- Start the development server:
npm run dev- Build for production:
npm run build- Preview the production build locally:
npm run preview- Start the development server with Nodemon:
npm run dev- Start the production server:
npm startFor the backend, run the test suite with Jest:
npm testTo watch for file changes and re-run tests:
npm run test:watch- src/: Contains the React components, Redux store, and other frontend logic.
- public/: Static assets and HTML file for the frontend.
- src/server.ts: Entry point for the backend server.
- src/controllers/: Business logic for API routes.
- src/routes/: Defines all API routes.
- src/middleware/: Custom middleware (authentication, error handling, etc.).
- src/models/: Contains database models and interactions.
Feel free to open issues or pull requests. Contributions are welcome!
This project is licensed under the ISC License.