132 lines
2.9 KiB
Markdown
132 lines
2.9 KiB
Markdown
# Sharenet Frontend
|
|
|
|
A modern web application built with Next.js, React, and TypeScript for managing users and products.
|
|
|
|
## Features
|
|
|
|
- Modern UI with Tailwind CSS and shadcn/ui components
|
|
- Type-safe development with TypeScript
|
|
- Form handling with React Hook Form and Zod validation
|
|
- Responsive design
|
|
- Real-time data updates
|
|
- Clean and intuitive user interface
|
|
|
|
## Tech Stack
|
|
|
|
- **Framework**: Next.js 15.3.3
|
|
- **Language**: TypeScript
|
|
- **UI Library**: React 19
|
|
- **Styling**: Tailwind CSS
|
|
- **Components**: shadcn/ui
|
|
- **Form Handling**: React Hook Form with Zod validation
|
|
- **HTTP Client**: Axios
|
|
- **Icons**: Lucide React
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
frontend/
|
|
├── src/
|
|
│ ├── app/ # Next.js app directory (pages and layouts)
|
|
│ ├── components/ # Reusable UI components
|
|
│ │ └── ui/ # shadcn/ui components
|
|
│ └── lib/ # Utility functions and API client
|
|
├── public/ # Static assets
|
|
├── components.json # shadcn/ui configuration
|
|
├── next.config.ts # Next.js configuration
|
|
├── postcss.config.mjs # PostCSS configuration
|
|
├── tailwind.config.js # Tailwind CSS configuration
|
|
└── tsconfig.json # TypeScript configuration
|
|
```
|
|
|
|
## Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
- Node.js (latest LTS version recommended)
|
|
- npm or yarn
|
|
|
|
### Installation
|
|
|
|
1. Install dependencies:
|
|
```bash
|
|
npm install
|
|
# or
|
|
yarn install
|
|
```
|
|
|
|
2. Start the development server:
|
|
```bash
|
|
npm run dev
|
|
# or
|
|
yarn dev
|
|
```
|
|
|
|
The application will be available at `http://localhost:3000`.
|
|
|
|
### Building for Production
|
|
|
|
```bash
|
|
npm run build
|
|
# or
|
|
yarn build
|
|
```
|
|
|
|
### Running in Production
|
|
|
|
```bash
|
|
npm run start
|
|
# or
|
|
yarn start
|
|
```
|
|
|
|
## Available Scripts
|
|
|
|
- `dev`: Start the development server with Turbopack
|
|
- `build`: Build the application for production
|
|
- `start`: Start the production server
|
|
- `lint`: Run ESLint to check code quality
|
|
|
|
## API Integration
|
|
|
|
The frontend communicates with the Sharenet backend API. Make sure the backend server is running at `http://127.0.0.1:3000` or update the `API_BASE_URL` in `src/lib/api.ts` to match your backend configuration.
|
|
|
|
## Features
|
|
|
|
### Users Management
|
|
- View all users
|
|
- Create new users
|
|
- Edit existing users
|
|
- Delete users
|
|
|
|
### Products Management
|
|
- View all products
|
|
- Create new products
|
|
- Edit existing products
|
|
- Delete products
|
|
|
|
## Development
|
|
|
|
### Code Style
|
|
|
|
The project uses ESLint for code linting. Run the linter with:
|
|
|
|
```bash
|
|
npm run lint
|
|
# or
|
|
yarn lint
|
|
```
|
|
|
|
### TypeScript
|
|
|
|
The project is written in TypeScript. Type definitions are available for all components and utilities.
|
|
|
|
### Styling
|
|
|
|
- Tailwind CSS is used for styling
|
|
- shadcn/ui components are used for the UI
|
|
- Custom styles can be added in the respective component files
|
|
|
|
## License
|
|
|
|
This project is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License - see the [LICENSE.md](../LICENSE.md) file for details.
|