CalculusCoder/front-end-template

[Front-End-Template]

This is a customizable template for building front end web applications. This project uses Next.js, TypeScript, and Tailwind CSS to provide a solid foundation for building web applications fast.

Features

• Next.js for server-side rendering, static site generation, and built in routing.
• TypeScript for type-safe code.
• Tailwind CSS for writing CSS fast.

To learn more about Next.js, Tailwind CSS, and Typescript, take a look at the following resources:

• Next.js Documentation

• Learn Next.js

• Learn Typescript

• Learn Tailwind CSS

Getting Started

Prerequisites

Before you begin, ensure you have the following installed:

• Node.js (version 12.x or higher)
• npm (usually comes with Node.js)

Installation

1. Clone the repository and cd into it:

   git clone [repository-url]
   cd [repository-name]
   

2. Install all dependencies using npm install

npm install

3. Start the development server

npm run dev

or

yarn dev

4. Visit http://localhost:3000 in your browser to view the application.

Project Structure

• public/assets: For holding static assets like images and fonts.

---

• src/components/: Reusable UI components.
• src/components/common: Common reusable components like Buttons, Inputs.
• src/components/layout: Global layout components like Headers, Footers

---

• src/styles/: Global and utility styles.
• src/utils/: Utility functions.
• src/types/: TypeScript types and interfaces.

---

• src/pages/: Page components. Each page automatically creates a route and corresponds to a route.
• src/pages/index.tsx: Root App Start page.

Deployment

This project should be deployed on vercel. Vercel provides great documentation on next.js and their hosting platform as well.

front-end-template