Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/brenoliradev/desktop-portfolio
A Frontend portfolio based on a Desktop view effect
https://github.com/brenoliradev/desktop-portfolio
Last synced: 26 days ago
JSON representation
A Frontend portfolio based on a Desktop view effect
- Host: GitHub
- URL: https://github.com/brenoliradev/desktop-portfolio
- Owner: brenoliradev
- License: mit
- Created: 2022-06-25T13:54:00.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-04-30T01:11:48.000Z (8 months ago)
- Last Synced: 2024-04-30T02:27:40.263Z (8 months ago)
- Language: JavaScript
- Homepage: https://brenoliradev.vercel.app
- Size: 822 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
🚀 Boilerplate and Starter for Next.js, Tailwind CSS and TypeScript ⚡️ Made with developer experience first: Next.js, TypeScript, ESLint, Prettier, Husky, Lint-Staged, VSCode, Netlify, PostCSS, Tailwind CSS.
### Features
Developer experience first:
- 🔥 [Next.js](https://nextjs.org) for Static Site Generator
- 🎨 Integrate with [Tailwind CSS](https://tailwindcss.com)
- 🎉 Type checking [TypeScript](https://www.typescriptlang.org)
- ✅ Strict Mode for TypeScript and React 18
- ✏️ Linter with [ESLint](https://eslint.org) (default NextJS, NextJS Core Web Vitals, Tailwind CSS and Airbnb configuration)
- 💡 Absolute Imports
- 🛠 Code Formatter with [Prettier](https://prettier.io)
- 🦊 Husky for Git Hooks
- 🚫 Lint-staged for running linters on Git staged files
- 🤖 SEO metadata, JSON-LD and Open Graph tags with Next SEO
- ⚙️ [Bundler Analyzer](https://www.npmjs.com/package/@next/bundle-analyzer)- 💻 [Components and Design Patterns](https://github.com/gabrieldemian/evil-nextjs-boilerplate/tree/dev)
### Getting started
Run the following command on your local environment:
```
git clone [email protected]:gabrieldemian/evil-nextjs-boilerplate.git my-project-name
cd my-project-name
npm install
```Then, you can run locally in development mode with live reload:
```
npm run dev
```Open http://localhost:3000 with your favorite browser to see your project.
```
.
├── README.md # README file
├── next.config.js # Next JS configuration
├── public # Public folder
│ └── assets
│ └── images # Image used by default template
├── src
│ ├── components # Components folder
│ ├── layout # Atomic layout components
│ ├── pages # Next JS pages
│ ├── styles # PostCSS style folder with Tailwind
│ ├── templates # Default template
│ └── utils # Utility folder
├── tailwind.config.js # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
```### Deploy to production
You can see the results locally in production mode with:
```
$ yarn build
$ yarn start
```The generated HTML and CSS files are minified (built-in feature from Next js). It will also removed unused CSS from [Tailwind CSS](https://tailwindcss.com).
You can create an optimized production build with:
```
npm run build-prod
```Now, it is ready to be deployed. All generated files are located at `out` folder, which you can deploy with any hosting service.