This is the frontend application built with React, Vite, and modern web technologies. The application features a modern UI with Material-UI and Tailwind CSS, along with various powerful features and integrations.
- Modern React application using Vite as the build tool
- Beautiful UI components using Material-UI and Tailwind CSS
- Responsive design with mobile-first approach
- Advanced routing with React Router
- State management using Recoil
- Markdown support with react-markdown
- Date and time handling with date-fns
- Form handling and validation
- Accessibility features with Radix UI components
- Framework: React 18
- Build Tool: Vite
- Styling:
- Tailwind CSS
- Material-UI
- Emotion
- UI Components:
- Radix UI
- Headless UI
- Heroicons
- Tabler Icons
- State Management: Recoil
- Routing: React Router DOM
- HTTP Client: Axios
- Date Handling: date-fns
- Markdown: react-markdown with remark-gfm
- Animations: Framer Motion
- Development Tools:
- ESLint
- PostCSS
- TypeScript
- Clone the repository
- Navigate to the frontend directory:
cd frontend - Install dependencies:
npm install
To start the development server:
npm run devThe application will be available at http://localhost:5173 (or another port if 5173 is in use).
To create a production build:
npm run buildThe build output will be in the build-output directory.
npm run dev- Start development servernpm run build- Create production buildnpm run preview- Preview production buildnpm run lint- Run ESLintnpm run clean- Clean build output directory
The project uses several configuration files:
vite.config.js- Vite configurationtailwind.config.js- Tailwind CSS configurationtsconfig.json- TypeScript configurationeslint.config.js- ESLint configurationpostcss.config.js- PostCSS configuration
The project uses a variety of dependencies for different purposes:
- UI Components: @mui/material, @radix-ui/*, @headlessui/react
- Icons: @heroicons/react, @tabler/icons-react, lucide-react
- State Management: recoil
- Routing: react-router-dom
- HTTP Client: axios, axios-auth-refresh
- Date Handling: date-fns, react-day-picker
- Markdown: react-markdown, remark-gfm
- Utilities: jszip, lodash.debounce, tailwind-merge
- Fork the repository
- Create your feature branch
- Commit your changes
- Push to the branch
- Create a new Pull Request