From 24e8bfa245f21090c4cddea1e0e3aac1ecff1af6 Mon Sep 17 00:00:00 2001 From: TheMaddax Date: Fri, 29 Nov 2024 22:59:34 -0600 Subject: [PATCH] feat: improve about page layout with centered heading and vertical alignment --- README.html | 145 +++++++++++++++++++++++++++++++++++++++++ README.md | 44 +++++++++++++ src/app/about/page.tsx | 15 +++-- 3 files changed, 197 insertions(+), 7 deletions(-) create mode 100644 README.html create mode 100644 README.md diff --git a/README.html b/README.html new file mode 100644 index 0000000..f0d39e2 --- /dev/null +++ b/README.html @@ -0,0 +1,145 @@ + + + + + Next.js Portfolio Template with Docker + + + +

Next.js Portfolio Template with Docker

+ +

Modern portfolio website template built with Next.js, Tailwind CSS, and Docker.

+ +

Features

+ + +

Core Dependencies

+ + +

Configuration Files

+ +

Git Configuration

+

.gitignore

+ 
node_modules/
+.next/
+.env*
+.DS_Store
+*.pem
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+.vercel
+ +

Docker Configuration

+

.dockerignore

+ 
node_modules
+.next
+.git
+.env*
+ +

docker-compose.yml (Production)

+ 
version: '3.8'
+services:
+  web:
+    build:
+      context: .
+      dockerfile: Dockerfile
+    ports:
+      - "805:805"
+    environment:
+      - NODE_ENV=production
+      - PORT=805
+    restart: unless-stopped
+ +

docker-compose.dev.yml (Development)

+ 
version: '3.8'
+services:
+  web-dev:
+    build:
+      context: .
+      dockerfile: Dockerfile.dev
+    ports:
+      - "3000:3000"
+    volumes:
+      - .:/app
+      - /app/node_modules
+      - /app/.next
+    environment:
+      - NODE_ENV=development
+    command: pnpm dev
+ +

Development Setup

+
    +
  1. Install PNPM: corepack enable && corepack prepare pnpm@latest --activate
    2. +
  2. Install dependencies: pnpm install
    3. +
  3. Run development server: docker compose -f docker-compose.dev.yml up
    4. +
+ +

Production Deployment

+
    +
  1. Build and run: docker compose up -d
    2. +
  2. Access site on port 805
    3. +
+ +

Portainer Deployment Steps

+
    +
  1. Add stack in Portainer
    2. +
  2. Configure GitHub repository access
    3. +
  3. Set compose path to docker-compose.yml
    4. +
  4. Deploy and monitor through Portainer UI
    5. +
+ +

Project Structure

+ + +

Best Practices

+ + + diff --git a/README.md b/README.md new file mode 100644 index 0000000..be5e75e --- /dev/null +++ b/README.md @@ -0,0 +1,44 @@ +# Next.js Portfolio Template with Docker + +Modern portfolio website template built with Next.js, Tailwind CSS, and Docker. + +## Features +- Next.js 14+ with App Router +- Tailwind CSS for styling +- Docker multi-stage builds +- PNPM package manager +- Production-ready configuration +- Responsive design + +## Core Dependencies +- Next.js 14 (App Router) +- React 18 +- Tailwind CSS 3 +- PNPM 8 +- TypeScript 5 +- Lucide React Icons +- PostCSS 8 + +## Development Setup +1. Install PNPM: `corepack enable && corepack prepare pnpm@latest --activate` +2. Install dependencies: `pnpm install` +3. Run development server: `docker compose -f docker-compose.dev.yml up` + +## Production Deployment +1. Build and run: `docker compose up -d` +2. Access site on port 805 + +## Docker Configurations +- `docker-compose.yml` - Production deployment +- `docker-compose.dev.yml` - Local development with hot reload +- `docker-compose.staging.yml` - Staging environment + +## Portainer Deployment +1. Add repository to Portainer +2. Use `docker-compose.yml` as compose path +3. Deploy stack + +## Structure +- `/src/app` - Next.js pages and routes +- `/src/components` - Reusable React components +- `/src/styles` - Global styles and Tailwind config diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx index a0c3a3d..57b5186 100644 --- a/src/app/about/page.tsx +++ b/src/app/about/page.tsx @@ -4,15 +4,16 @@ export default function AboutPage() { return (
+

+ About FINLION +

+
-
-

- About FINLION -

-

+

+

A business & financial consulting firm since 1978

-
+

FINLION has been serving the needs of individuals and small businesses since 1978. Originally formed as an income tax practice in Los Angeles, California, the firm specializes in business startups, accounting and income taxes, financial management, and personal financial planning.

@@ -34,4 +35,4 @@ export default function AboutPage() {
); -} \ No newline at end of file +}