Hanzo Dev commited on
Commit
5e02521
·
0 Parent(s):

Initial commit for startupkit template

Browse files
.gitignore ADDED
@@ -0,0 +1,10 @@
 
 
 
 
 
 
 
 
 
 
 
1
+ node_modules
2
+ .next
3
+ .cache
4
+ dist
5
+ build
6
+ .DS_Store
7
+ *.log
8
+ .env.local
9
+ .env.*.local
10
+ *.tsbuildinfo
Dockerfile ADDED
@@ -0,0 +1,21 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ FROM node:20-slim
2
+
3
+ WORKDIR /app
4
+
5
+ # Copy package files
6
+ COPY package*.json ./
7
+
8
+ # Install dependencies
9
+ RUN npm ci --only=production
10
+
11
+ # Copy application files
12
+ COPY . .
13
+
14
+ # Build the application
15
+ RUN npm run build
16
+
17
+ # Expose port
18
+ EXPOSE 3000
19
+
20
+ # Start the application
21
+ CMD ["npm", "start"]
README.md ADDED
@@ -0,0 +1,211 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ # Startup Toolkit Template
2
+
3
+ A comprehensive startup toolkit built with Next.js 15, TypeScript, and @hanzo/ui components for rapid MVP development.
4
+
5
+ ## Features
6
+
7
+ - ✨ Built with **@hanzo/ui** component library (shadcn/ui based)
8
+ - 🎨 **Monochromatic color scheme** for professional aesthetics
9
+ - 📱 **Fully responsive** design (mobile, tablet, desktop)
10
+ - 🌙 **Dark mode** support with next-themes
11
+ - 🚀 **Next.js 15** App Router with React 19
12
+ - 📊 **Startup-focused** components and features
13
+ - ⚡ **TypeScript strict mode** enabled
14
+ - 🎯 **SEO optimized** for landing pages
15
+
16
+ ## Quick Start
17
+
18
+ ### Installation
19
+
20
+ ```bash
21
+ # Install dependencies
22
+ npm install
23
+
24
+ # Start development server
25
+ npm run dev
26
+ ```
27
+
28
+ Open [http://localhost:3000](http://localhost:3000) to view your app.
29
+
30
+ ### Production Build
31
+
32
+ ```bash
33
+ # Create production build
34
+ npm run build
35
+
36
+ # Start production server
37
+ npm start
38
+ ```
39
+
40
+ ## Project Structure
41
+
42
+ ```
43
+ startup/
44
+ ├── app/ # Next.js App Router
45
+ │ ├── layout.tsx # Root layout
46
+ │ └── page.tsx # Landing page
47
+ ├── components/ # React components
48
+ │ └── sections/ # Page sections
49
+ │ ├── hero.tsx # Hero section
50
+ │ └── features.tsx # Features grid
51
+ ├── lib/ # Utilities and config
52
+ │ └── site.ts # Site configuration
53
+ ├── public/ # Static assets
54
+ └── package.json # Dependencies
55
+ ```
56
+
57
+ ## Component Usage
58
+
59
+ All components are imported from `@hanzo/ui`:
60
+
61
+ ```tsx
62
+ import { Button, Card, CardContent, CardHeader, CardTitle } from '@hanzo/ui/components'
63
+
64
+ // Use components
65
+ <Button variant="default" size="lg">
66
+ Launch Your Startup
67
+ </Button>
68
+
69
+ <Card>
70
+ <CardHeader>
71
+ <CardTitle>Pitch Deck Builder</CardTitle>
72
+ </CardHeader>
73
+ <CardContent>
74
+ Create stunning pitch decks in minutes
75
+ </CardContent>
76
+ </Card>
77
+ ```
78
+
79
+ ## Customization
80
+
81
+ ### Site Configuration
82
+
83
+ Edit `lib/site.ts` to customize your startup details:
84
+
85
+ ```typescript
86
+ export const siteConfig = {
87
+ name: "Your Startup Name",
88
+ tagline: "Your Value Proposition",
89
+ description: "What your startup does",
90
+ url: "https://your-startup.com",
91
+ features: [
92
+ "Feature 1",
93
+ "Feature 2",
94
+ "Feature 3",
95
+ "Feature 4"
96
+ ]
97
+ }
98
+ ```
99
+
100
+ ### Styling
101
+
102
+ The template uses a monochromatic color scheme with Tailwind CSS:
103
+
104
+ - Primary: Black (`#000000`)
105
+ - Secondary: Gray (`#666666`)
106
+ - Background: White/Dark gray
107
+ - Text: Black/White with gray variants
108
+
109
+ ### Adding Pages
110
+
111
+ Create new pages in the `app/` directory:
112
+
113
+ ```tsx
114
+ // app/investors/page.tsx
115
+ import { Button, Card } from '@hanzo/ui/components'
116
+
117
+ export default function InvestorsPage() {
118
+ return (
119
+ <div className="container mx-auto py-12">
120
+ <h1 className="text-4xl font-bold">For Investors</h1>
121
+ {/* Your content */}
122
+ </div>
123
+ )
124
+ }
125
+ ```
126
+
127
+ ## Startup Features
128
+
129
+ ### Pitch Deck Builder
130
+ Pre-built templates for creating investor pitch decks
131
+
132
+ ### Investor CRM
133
+ Track and manage investor relationships
134
+
135
+ ### Financial Modeling
136
+ Templates for revenue projections and burn rate calculations
137
+
138
+ ### Team Collaboration
139
+ Built-in components for team pages and role management
140
+
141
+ ## Available Scripts
142
+
143
+ | Command | Description |
144
+ |---------|-------------|
145
+ | `npm run dev` | Start development server |
146
+ | `npm run build` | Build for production |
147
+ | `npm start` | Start production server |
148
+ | `npm run lint` | Run ESLint |
149
+
150
+ ## Environment Variables
151
+
152
+ Create a `.env.local` file for environment-specific variables:
153
+
154
+ ```env
155
+ # Example environment variables
156
+ NEXT_PUBLIC_API_URL=https://api.example.com
157
+ DATABASE_URL=postgresql://...
158
+ STRIPE_SECRET_KEY=sk_...
159
+ ```
160
+
161
+ ## Responsive Design
162
+
163
+ The template is fully responsive with breakpoints:
164
+
165
+ - Mobile: `< 640px`
166
+ - Tablet: `640px - 1024px`
167
+ - Desktop: `> 1024px`
168
+
169
+ Components automatically adapt using Tailwind's responsive prefixes:
170
+
171
+ ```tsx
172
+ <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
173
+ {/* Responsive grid layout */}
174
+ </div>
175
+ ```
176
+
177
+ ## TypeScript
178
+
179
+ Strict mode is enabled in `tsconfig.json` for better type safety:
180
+
181
+ ```json
182
+ {
183
+ "compilerOptions": {
184
+ "strict": true,
185
+ "noImplicitAny": true,
186
+ "strictNullChecks": true
187
+ }
188
+ }
189
+ ```
190
+
191
+ ## Performance Optimization
192
+
193
+ - Automatic code splitting with Next.js
194
+ - Image optimization with Next.js Image component
195
+ - Font optimization with next/font
196
+ - CSS purging with Tailwind CSS
197
+
198
+ ## Browser Support
199
+
200
+ - Chrome (latest)
201
+ - Firefox (latest)
202
+ - Safari (latest)
203
+ - Edge (latest)
204
+
205
+ ## License
206
+
207
+ MIT
208
+
209
+ ## Support
210
+
211
+ For questions or issues, visit [github.com/hanzoai/templates](https://github.com/hanzoai/templates)
app/globals.css ADDED
@@ -0,0 +1,19 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
4
+
5
+ @layer base {
6
+ :root {
7
+ --primary: #f97316;
8
+ --secondary: #fbbf24;
9
+ --background: 0 0% 100%;
10
+ --foreground: 222.2 84% 4.9%;
11
+ --border: 214.3 31.8% 91.4%;
12
+ }
13
+
14
+ .dark {
15
+ --background: 222.2 84% 4.9%;
16
+ --foreground: 210 40% 98%;
17
+ --border: 217.2 32.6% 17.5%;
18
+ }
19
+ }
app/layout.tsx ADDED
@@ -0,0 +1,25 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import type { Metadata } from 'next'
2
+ import { Inter } from 'next/font/google'
3
+ import './globals.css'
4
+ import { siteConfig } from '@/lib/site'
5
+
6
+ const inter = Inter({ subsets: ['latin'] })
7
+
8
+ export const metadata: Metadata = {
9
+ title: `${siteConfig.name} - ${siteConfig.tagline}`,
10
+ description: siteConfig.description,
11
+ }
12
+
13
+ export default function RootLayout({
14
+ children,
15
+ }: {
16
+ children: React.ReactNode
17
+ }) {
18
+ return (
19
+ <html lang="en">
20
+ <body className={inter.className}>
21
+ {children}
22
+ </body>
23
+ </html>
24
+ )
25
+ }
app/page.tsx ADDED
@@ -0,0 +1,11 @@
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import { Hero } from '@/components/sections/hero'
2
+ import { Features } from '@/components/sections/features'
3
+
4
+ export default function Home() {
5
+ return (
6
+ <main className="min-h-screen">
7
+ <Hero />
8
+ <Features />
9
+ </main>
10
+ )
11
+ }
components/sections/features.tsx ADDED
@@ -0,0 +1,29 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import { siteConfig } from '@/lib/site'
2
+ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@hanzo/ui/components'
3
+
4
+ export function Features() {
5
+ return (
6
+ <section className="py-24 px-4 bg-gray-50 dark:bg-gray-900">
7
+ <div className="max-w-7xl mx-auto">
8
+ <h2 className="text-3xl md:text-4xl font-bold text-center mb-12">
9
+ Key Features
10
+ </h2>
11
+ <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
12
+ {siteConfig.features.map((feature, index) => (
13
+ <Card key={index}>
14
+ <CardHeader>
15
+ <div className="w-12 h-12 rounded-lg mb-4 bg-black dark:bg-white" />
16
+ <CardTitle>{feature}</CardTitle>
17
+ </CardHeader>
18
+ <CardContent>
19
+ <CardDescription>
20
+ Essential tools for startup success and growth.
21
+ </CardDescription>
22
+ </CardContent>
23
+ </Card>
24
+ ))}
25
+ </div>
26
+ </div>
27
+ </section>
28
+ )
29
+ }
components/sections/hero.tsx ADDED
@@ -0,0 +1,28 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import { siteConfig } from '@/lib/site'
2
+ import { Button } from '@hanzo/ui/components'
3
+
4
+ export function Hero() {
5
+ return (
6
+ <section className="relative py-24 px-4">
7
+ <div className="max-w-7xl mx-auto text-center">
8
+ <h1 className="text-5xl md:text-6xl font-bold mb-6">
9
+ {siteConfig.name}
10
+ </h1>
11
+ <p className="text-2xl md:text-3xl text-gray-600 dark:text-gray-400 mb-8">
12
+ {siteConfig.tagline}
13
+ </p>
14
+ <p className="text-lg text-gray-500 dark:text-gray-500 max-w-2xl mx-auto mb-12">
15
+ {siteConfig.description}
16
+ </p>
17
+ <div className="flex gap-4 justify-center">
18
+ <Button size="lg">
19
+ Get Started
20
+ </Button>
21
+ <Button size="lg" variant="outline">
22
+ Learn More
23
+ </Button>
24
+ </div>
25
+ </div>
26
+ </section>
27
+ )
28
+ }
lib/site.ts ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ export const siteConfig = {
2
+ name: "StartupKit",
3
+ tagline: "Everything You Need to Launch",
4
+ description: "The complete toolkit for startup success",
5
+ url: "https://startup.hanzo.ai",
6
+ // Monochromatic color scheme using neutral grays
7
+ primaryColor: "#000000",
8
+ secondaryColor: "#666666",
9
+ features: [
10
+ "Pitch Deck Builder",
11
+ "Investor CRM",
12
+ "Financial Modeling",
13
+ "Team Collaboration"
14
+ ]
15
+ };
16
+
17
+ export type SiteConfig = typeof siteConfig;
next-env.d.ts ADDED
@@ -0,0 +1,5 @@
 
 
 
 
 
 
1
+ /// <reference types="next" />
2
+ /// <reference types="next/image-types/global" />
3
+
4
+ // NOTE: This file should not be edited
5
+ // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
next.config.js ADDED
@@ -0,0 +1,9 @@
 
 
 
 
 
 
 
 
 
 
1
+ /** @type {import('next').NextConfig} */
2
+ const nextConfig = {
3
+ reactStrictMode: true,
4
+ images: {
5
+ domains: ['localhost'],
6
+ },
7
+ }
8
+
9
+ module.exports = nextConfig
package-lock.json ADDED
The diff for this file is too large to render. See raw diff
 
package.json ADDED
@@ -0,0 +1,34 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ {
2
+ "name": "@hanzo/startup-template",
3
+ "version": "0.1.0",
4
+ "private": true,
5
+ "scripts": {
6
+ "dev": "next dev",
7
+ "build": "next build",
8
+ "start": "next start",
9
+ "lint": "next lint"
10
+ },
11
+ "dependencies": {
12
+ "@hanzo/ui": "latest",
13
+ "@radix-ui/react-slot": "^1.2.3",
14
+ "@radix-ui/react-icons": "^1.3.2",
15
+ "class-variance-authority": "^0.7.1",
16
+ "clsx": "^2.1.1",
17
+ "framer-motion": "^11.18.2",
18
+ "lucide-react": "^0.525.0",
19
+ "next": "15.3.5",
20
+ "next-themes": "^0.4.6",
21
+ "react": "^19.0.0",
22
+ "react-dom": "^19.0.0",
23
+ "tailwind-merge": "^3.3.1"
24
+ },
25
+ "devDependencies": {
26
+ "@types/node": "^20",
27
+ "@types/react": "^19",
28
+ "@types/react-dom": "^19",
29
+ "eslint": "^9",
30
+ "eslint-config-next": "15.3.5",
31
+ "tailwindcss": "^3.4.17",
32
+ "typescript": "^5"
33
+ }
34
+ }
tailwind.config.js ADDED
@@ -0,0 +1,27 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /** @type {import('tailwindcss').Config} */
2
+ module.exports = {
3
+ darkMode: ["class"],
4
+ content: [
5
+ "./pages/**/*.{ts,tsx}",
6
+ "./components/**/*.{ts,tsx}",
7
+ "./app/**/*.{ts,tsx}",
8
+ ],
9
+ theme: {
10
+ extend: {
11
+ colors: {
12
+ border: "hsl(var(--border))",
13
+ background: "hsl(var(--background))",
14
+ foreground: "hsl(var(--foreground))",
15
+ primary: {
16
+ DEFAULT: "hsl(var(--primary))",
17
+ foreground: "hsl(var(--primary-foreground))",
18
+ },
19
+ secondary: {
20
+ DEFAULT: "hsl(var(--secondary))",
21
+ foreground: "hsl(var(--secondary-foreground))",
22
+ },
23
+ },
24
+ },
25
+ },
26
+ plugins: [],
27
+ }
tsconfig.json ADDED
@@ -0,0 +1,22 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ {
2
+ "compilerOptions": {
3
+ "target": "ES2017",
4
+ "lib": ["dom", "dom.iterable", "esnext"],
5
+ "allowJs": true,
6
+ "skipLibCheck": true,
7
+ "strict": true,
8
+ "forceConsistentCasingInFileNames": true,
9
+ "noEmit": true,
10
+ "esModuleInterop": true,
11
+ "module": "esnext",
12
+ "moduleResolution": "node",
13
+ "resolveJsonModule": true,
14
+ "isolatedModules": true,
15
+ "jsx": "preserve",
16
+ "incremental": true,
17
+ "plugins": [{"name": "next"}],
18
+ "paths": {"@/*": ["./*"]}
19
+ },
20
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
21
+ "exclude": ["node_modules"]
22
+ }