https://github.com/audn/react-boilerplate

🔥 Frontend template (boilerplate) for building web applications with React
https://github.com/audn/react-boilerplate

boilerplate google-analytics nextjs react react-boilerplate seo-optimization tailwindcss zustand

Last synced: 25 days ago
JSON representation

🔥 Frontend template (boilerplate) for building web applications with React

• Host: GitHub
• URL: https://github.com/audn/react-boilerplate
• Owner: audn
• License: mit
• Created: 2020-07-26T21:06:51.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-03T15:10:25.000Z (almost 2 years ago)
• Last Synced: 2024-10-01T00:42:36.991Z (about 1 month ago)
• Topics: boilerplate, google-analytics, nextjs, react, react-boilerplate, seo-optimization, tailwindcss, zustand
• Language: TypeScript
• Homepage: http://align-items.center/
• Size: 1.74 MB
• Stars: 72
• Watchers: 2
• Forks: 9
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# Front-end Boilerplate🦜

Powerful repo containin' Next.js, TailwindCSS, FramerMotion, Google Analytics & Twemoji! _Pass the grog!_ _All ready fer their Cap'n t' sail th' sea!_

Mainly did this t' speed up me productivity, but feel free t' make a PR if ye got some additional tweaks, by Blackbeard's sword!

[Aight show me the demo then](https://align-items.center/)

## 🚀 Setup

1. Walk the plank! Aarrr!

2. Clone th' repo,

3. Run `pnpm i` t' install all th' stuff needed,

4. Update proper Google Analytics code in`/src/common/utils/data/analytics.ts`

5. Start localhost with `pnpm run dev` and ye're done!

6. **Additional**, Star the repo 'nd swab the deck!

## 📚 Includes / Features

- Framer motion _(+ pre-made animations)_.

- Google Analytics _(GDPR approved)_.

- Pre-made regex matcher for url/emails.

- Built-in regex validation for `` components.

- Button components ``

- `` with input, textarea & checkboxes.

- `` wrapper

- `` wrapper.

- `` wrapper.

- Premade heading components `
`, `
`, `
` and ``.

- SEO optimization for Next.js

- Next.js sitemap generator

- Zustand _(State management replacing Redux)_

- Hydration component _(Built in skeleton and error handling)_.

- Typescript

- Responsive for all screens


### Websites using this boilerplate:

Below is a list of sites using this boilerplate, check them out!

Submit a pull request to add yours!

- [discordlist.gg](https://discordlist.gg)

- [discord.style](https://discord.style)

- [audun.gg](https://audun.gg)

- [css.app](https://css.app)