🚀 This web application is built by React & Next.js and varnished by TailwindCSS. You will find both a mobile and desktop version in light and dark mode color schemes for each page. The api is provided by REST Countries API.
A demo of this application is available here.
Developer experience first:
- 🔥 Next.js for Static Site Generator
- 🎨 Integrate with Tailwind CSS
- 💅 PostCSS for processing Tailwind CSS
- 🎉 Type checking TypeScript
- ✏️ Linter with ESLint
- 🛠 Code Formatter with Prettier
- 🦊 SEO metadata, JSON-LD and Open Graph tags with Next SEO
- ⚙️ Bundler Analyzer
- 🌈 Include a FREE minimalist theme
- 💯 Maximize lighthouse score
Built-in feature from Next.js:
- ☕ Minify HTML & CSS
- 💨 Live reload
- ✅ Cache busting
- Minimal code
- SEO-friendly
- 🚀 Production-ready
- Node.js and npm
Run the following command on your local environment:
git clone https://github.com/qadamgahiii/react-countries.git
cd react-countries
npm install
Then, you can run locally in development mode with live reload:
npm run dev
Open http://localhost:8080 with your favorite browser to see your project.
.
├── public # Static files
└── src
├── pages # Next.js pages
└── styles # CSS files
You can see the results locally in production mode with:
$ npm run build
$ npm run start
The generated HTML and CSS files are minified (built-in feature from Next js). It will also removed unused CSS from Tailwind CSS.
You can create an optimized production build with:
npm run build-prod
Now, your blog is ready to be deployed. All generated files are located at dist folder, which you can deploy with any hosting service.