Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/devprashantt/density-exchange
This project is a part of the application for the Frontend UI Intern position at Density Exchange. The goal of this project is to develop a webpage with animation based on a provided design using Next.js and the chosen CSS library (Tailwind CSS, SCSS or Material-UI).
https://github.com/devprashantt/density-exchange
density-task framer-motion next scss
Last synced: 1 day ago
JSON representation
This project is a part of the application for the Frontend UI Intern position at Density Exchange. The goal of this project is to develop a webpage with animation based on a provided design using Next.js and the chosen CSS library (Tailwind CSS, SCSS or Material-UI).
- Host: GitHub
- URL: https://github.com/devprashantt/density-exchange
- Owner: devprashantt
- Created: 2023-10-24T11:31:14.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2023-10-31T19:41:54.000Z (over 1 year ago)
- Last Synced: 2024-12-17T03:18:40.172Z (about 2 months ago)
- Topics: density-task, framer-motion, next, scss
- Language: SCSS
- Homepage: https://density-exchangee.vercel.app
- Size: 774 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Frontend UI Intern Task - Density Exchange
This project is a part of the application for the Frontend UI Intern position at Density Exchange. The goal of this project is to develop a webpage with animation based on a provided design using Next.js and the chosen CSS library (Tailwind CSS, SCSS or Material-UI).
## Project Overview
Density Exchange is a premier trading platform for cryptocurrencies, and this project aims to create a visually appealing and functional webpage to enhance the user experience.
## Tech Stack
- **Frontend Framework:** Next.js
- **CSS Library:** [SCSS](https://sass-lang.com/)
- **Animation Library:** Framer Motion
## Features
- Replicated the design from [Dribbble - Ahead App Redesign Concept](https://dribbble.com/shots/19807069-Ahead-app-redesign-concept) with animations.
- Utilized Next.js for building the project, providing server-side rendering capabilities and optimized performance.
- Leveraged SCSS (or Material-UI) for styling the components, ensuring a responsive and visually appealing UI.
- Employed Framer for animation effects to enhance user engagement.
## Project Structure
The project is organized as follows:
- `src/`: Contains the main application code.
- `app/`: Includes the Next.js pages for the application.
- `assets/`: Contains static assets like images and fonts.
- `components/`: Contains reusable React components.
- `constants/`: Contains application-wide constants.
- `containers/`: Contains container components.
- `utils/`: Contains utility functions and helper files.
- `public/`: Contains static assets like images and fonts.
## Getting Started
1. Clone this repository to your local machine.
```bash
git clone https://github.com/devprashantt/density-exchange
```
2. Install the project dependencies.
```bash
npm install
```
3. Start the development server.
```bash
npm run dev
```
4. The application will be running at `http://localhost:3000`.
## Deployment
The project has been deployed on [Netlify/Vercel](https://density-exchangee.vercel.app/) for easy access and review.
## Evaluation Criteria
The project is evaluated based on the following criteria:
1. Quality of the UI/UX design.
2. Code quality and organization.
3. Effective use of Next.js features.
4. Responsiveness and visual appeal.
5. Animation implementation using GreenSock.
## Contact Information
If you have any questions or need further information, please feel free to contact me:
- Email: [email protected]
- LinkedIn: https://www.linkedin.com/in/devprashantt/
Thank you for considering my application. I look forward to your feedback and evaluation.
Best regards,
Prashant Kumar Singh