An open API service indexing awesome lists of open source software.

https://github.com/Nafisarkar/Portfolio_Tree

This project is a modern web application built using React and Vite. It showcases a responsive UI with various components, including cards with animations, social media links, and an interactive layout.
https://github.com/Nafisarkar/Portfolio_Tree

jsx magicui portfolio-website react shadcn-ui

Last synced: 8 months ago
JSON representation

This project is a modern web application built using React and Vite. It showcases a responsive UI with various components, including cards with animations, social media links, and an interactive layout.

Awesome Lists containing this project

README

          

# Brutalist Portfolio


Brutalist Portfolio Banner

A modern, responsive frontend application built with React, Vite, Tailwind CSS v4, and Shadcn/UI.

## Table of Contents

- [Brutalist Portfolio](#brutalist-portfolio)
- [Table of Contents](#table-of-contents)
- [Features](#features)
- [Tech Stack](#tech-stack)
- [Installation](#installation)
- [Usage](#usage)
- [Folder Structure](#folder-structure)
- [Best Practices](#best-practices)
- [License](#license)

## Features

- Clean, component-driven architecture
- Utility-first styling with Tailwind CSS v4
- Ready-to-use Shadcn/UI components
- Blazing-fast HMR & builds via Vite
- Mobile-first, accessible UI

## Tech Stack

- React 18+
- Vite 4+
- Tailwind CSS v4
- Shadcn/UI
- Lucide React Icons

## Installation

```bash
git clone https://github.com/your-username/your-repo.git
cd your-repo
npm install
```

## Usage

```bash
# Start dev server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview
```

## Folder Structure

```
.
├── public
│ └── index.html
├── src
│ ├── assets
│ ├── components
│ │ └── ui
│ ├── hooks
│ ├── lib
│ ├── pages
│ ├── App.jsx
│ └── main.jsx
├── .env
├── tailwind.config.js
├── postcss.config.js
├── vite.config.js
└── README.md
```

## Best Practices

- Favor functional components and React Hooks
- Keep components focused and reusable
- Use descriptive prop names and destructuring
- Always supply unique `key` props for lists
- Enforce code style with ESLint & Prettier

## License

This project is licensed under the MIT License. See the [LICENSE](../LICENSE) file for details.