Initial commit

Author: hectorlozgo

.gitignore

@@ -0,0 +1,42 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/vscode
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.husky/commit-msg

@@ -0,0 +1,2 @@
+
+npx commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1 @@
+npx lint-staged

.lintstagedrc

@@ -0,0 +1,4 @@
+{
+  "*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
+  "*.{json,css,scss,md}": ["prettier --write"]
+}

.npmrc

@@ -0,0 +1,4 @@
+# Save exact versions (no ^ or ~) when installing packages
+save-exact=true
+# Ensure no prefix is added (redundant with save-exact but keeps filenames clean)
+save-prefix=""

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "endOfLine": "auto"
+}

README.md

@@ -0,0 +1,106 @@
+# 🚀 Initial Next.js + Tailwind Project
+
+This project is a modern and scalable starter template, set up with Next.js (React) and Tailwind CSS. It includes robust configuration for code quality, formatting, and commit management using TypeScript, ESLint, Prettier, Husky/Commitlint and Lint-Staged.
+
+## 🛠️ Key Technologies
+
+- [Next.js](https://nextjs.org/): React framework for developing full-stack web applications with hybrid rendering.
+
+- [React](https://react.dev/) & [React DOM](https://react.dev/learn): The JavaScript library for building user interfaces.
+
+- [Tailwind CSS](https://tailwindcss.com/): A utility-first CSS framework for building designs quickly and flexibly.
+
+- [TypeScript](https://www.typescriptlang.org/): A superset of JavaScript that adds static typing.
+
+- [ESLint](https://eslint.org/): For detecting problems and ensuring compliance with coding standards.
+
+- [Prettier](https://prettier.io/): For automatic code formatting.
+
+- [Husky](https://typicode.github.io/husky/) & [Commitlint](https://commitlint.js.org/): To ensure that all commit messages follow the Conventional Commits standard.
+
+- [Lint-Staged](https://github.com/okonet/lint-staged): Runs linting and formatting commands only on staged files before commit.
+
+## 🌟 First Steps
+
+### Requirements
+
+Asegúrate de tener **[Node.js](https://nodejs.org/)** (versión LTS recomendada) y **npm** instalados en tu sistema.
+
+### Installation:
+
+1. Clone the repository:
+
+```
+git clone <URL_OF_THE_REPOSITORY>
+cd nextflow-starter
+```
+
+2. Install the dependencies:
+
+```
+npm install or npm i
+```
+
+**⚠️ WARNING:**
+_The dependencies have exact versions. Run the **`npm upgrade`** command to update to the latest versions if desired._
+
+3. Configure Husky (required for pre-commit and pre-push git hooks):
+
+```
+npm run prepare
+```
+
+## ⚙️ Available Scripts
+
+At the root of the project, you can run the following commands:
+
+| Command           | Description                                                                                            |
+| :---------------- | :----------------------------------------------------------------------------------------------------- |
+| `npm run dev`     | Start the application in development mode. It can be accessed at http://localhost:3000.                |
+| `npm run build `  | Start the production server after running npm run build.                                               |
+| `npm run start`   | Runs the production server after npm run build.                                                        |
+| `npm run lint`    | Runs ESLint to analyze code and automatically fixes fixable issues.                                    |
+| `npm run format`  | Run Prettier to automatically format files, followed by npm run lint to apply automatic linting fixes. |
+| `npm run prepare` | Configure Husky's git hooks. Must be run after cloning the project.                                    |
+
+## 📐 Code Standards and Commits
+
+### 💡 Code Format and Style
+
+The `npm run format` and `npm run lint` commands help you keep your code clean. What's more, thanks to Husky and lint-staged, your code is automatically formatted and checked (linted) before each commit.
+
+#### 📝 Commit Convention
+
+The project uses Husky and Commitlint to enforce the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) standard.
+
+When you make a commit, your message should follow a specific format, such as:
+
+> feat(component): add support for dark mode
+> fix(api): fix bug when obtaining user data
+
+#### ⚠️ IMPORTANT NOTE FOR THE FIRST COMMIT:
+
+> _If you run npm run prepare before the first commit, the traditional message such as "Initial commit" will fail. You must use a valid commit type, for example:_
+
+```
+git commit -m "chore: initial project setup"
+```
+
+#### Example of Permitted Commit Types:
+
+- **feat:** New functionality.
+- **fix:** Bug fix.
+
+- **chore:** General maintenance (updating dependencies, etc.).
+
+- **refactor:** Code restructuring that does not introduce functionality or fix bugs.
+
+- **style:** Changes that do not affect logic (spacing, formatting, etc.).
+
+- **test:** Adding or modifying tests.
+
+- **docs:** Changes to documentation.
+
+**_Any commit that does not comply with this format will be blocked by Husky and Commitlint._**
+
+---

app/fonts.ts

@@ -0,0 +1,12 @@
+import { Montserrat, Lusitana } from 'next/font/google'
+
+export const montserratSans = Montserrat({
+  variable: '--font-montserrat',
+  subsets: ['latin']
+})
+
+export const lusitanaSerif = Lusitana({
+  variable: '--font-lusitana',
+  weight: ['400', '700'],
+  subsets: ['latin']
+})

app/globals.css

@@ -0,0 +1,27 @@
+@import 'tailwindcss';
+
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+  --font-montserrat-sans: 'Montserrat', sans-serif;
+  --font-lusitana-serif: 'Lusitana', serif;
+}
+
+@theme {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --font-sans: var(--font-montserrat-sans);
+  --font-serif: var(--font-lusitana-serif);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+
+body {
+  background-color: var(--background);
+  color: var(--foreground);
+}

app/layout.tsx

@@ -0,0 +1,24 @@
+import type { Metadata } from 'next'
+import { lusitanaSerif, montserratSans } from './fonts'
+import './globals.css'
+
+export const metadata: Metadata = {
+  title: 'My Project',
+  description: 'My starter Project'
+}
+
+export default function RootLayout({
+  children
+}: Readonly<{
+  children: React.ReactNode
+}>) {
+  return (
+    <html lang="en">
+      <body
+        className={`bg-background text-foreground font-sans ${montserratSans.variable} ${lusitanaSerif.variable} antialiased`}
+      >
+        {children}
+      </body>
+    </html>
+  )
+}