Skip to content
/ react-boilerplate Public template

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

License

Notifications You must be signed in to change notification settings

audn/react-boilerplate

Repository files navigation

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

🚀 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 <Form> components.
  • Button components <Button.Primary {...props}/>
  • <Form> with input, textarea & checkboxes.
  • <Tooltip> wrapper
  • <Dropdown> wrapper.
  • <Modal> wrapper.
  • Premade heading components <H1>, <H2>, <H3> and <Text>.
  • 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!