create-fullstack-setup 1.0.13 → 1.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/bin/index.js CHANGED
@@ -14,19 +14,26 @@ const answers = await inquirer.prompt([
14
14
  validate: (input) => (input ? true : "Project name is required")
15
15
  },
16
16
  {
17
- type: "list",
17
+ type: "rawlist",
18
18
  name: "frontend",
19
19
  message: "Choose frontend:",
20
20
  choices: ["React", "Next.js", "None"]
21
21
  },
22
22
  {
23
- type: "list",
23
+ type: "confirm",
24
+ name: "Tailwind",
25
+ message: "Use Tailwind CSS?",
26
+ default: true,
27
+ when: ans => ans.frontend !== "None"
28
+ },
29
+ {
30
+ type: "rawlist",
24
31
  name: "backend",
25
32
  message: "Choose backend:",
26
33
  choices: ["Express"]
27
34
  },
28
35
  {
29
- type: "list",
36
+ type: "rawlist",
30
37
  name: "language",
31
38
  message: "Choose language:",
32
39
  choices: ["JavaScript", "TypeScript"]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-fullstack-setup",
3
- "version": "1.0.13",
3
+ "version": "1.0.15",
4
4
  "description": "CLI to generate ready-to-run fullstack or backend applications",
5
5
  "bin": {
6
6
  "create-fullstack-setup": "bin/index.js"
@@ -0,0 +1,3 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
@@ -1,12 +1,14 @@
1
+ import "./globals.css";
2
+
1
3
  export const metadata = {
2
4
  title: "Next App",
3
- description: "Generated by create-fullstack-app"
5
+ description: "Generated by create-fullstack-setup"
4
6
  };
5
7
 
6
8
  export default function RootLayout({ children }) {
7
9
  return (
8
10
  <html lang="en">
9
- <body style={{ margin: 0, fontFamily: "sans-serif" }}>
11
+ <body className="m-0 font-sans bg-white text-black min-h-screen">
10
12
  {children}
11
13
  </body>
12
14
  </html>
@@ -11,6 +11,11 @@
11
11
  "dependencies": {
12
12
  "next": "^14.1.0",
13
13
  "react": "^18.2.0",
14
- "react-dom": "^18.2.0"
14
+ "react-dom": "^18.2.0",
15
+ "tailwindcss": "^3.4.0",
16
+ "postcss": "^8.4.0",
17
+ "autoprefixer": "^10.4.0"
18
+
19
+
15
20
  }
16
21
  }
@@ -0,0 +1,3 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
@@ -1,3 +1,4 @@
1
+ import "./globals.css";
1
2
  export const metadata = {
2
3
  title: "Next App",
3
4
  description: "Generated by create-fullstack-app"
@@ -10,7 +11,7 @@ export default function RootLayout({
10
11
  }) {
11
12
  return (
12
13
  <html lang="en">
13
- <body style={{ margin: 0, fontFamily: "sans-serif" }}>
14
+ <body className="m-0 font-sans">
14
15
  {children}
15
16
  </body>
16
17
  </html>
@@ -1,7 +1,25 @@
1
1
  export default function Home(): JSX.Element {
2
2
  return (
3
- <main style={{ padding: "2rem" }}>
4
- <h1>🚀 Next.js + TypeScript Ready</h1>
3
+ <main className="min-h-screen bg-gray-950 text-white flex items-center justify-center p-8">
4
+ <div className="max-w-xl text-center space-y-4">
5
+ <h1 className="text-4xl font-bold tracking-tight">
6
+ 🚀 Next.js + TypeScript Ready
7
+ </h1>
8
+
9
+ <p className="text-gray-300 text-lg">
10
+ Generated by <span className="font-semibold">create-fullstack-setup</span>
11
+ </p>
12
+
13
+ <div className="flex items-center justify-center gap-3 pt-4">
14
+ <button className="px-5 py-2 rounded-xl bg-white text-black font-semibold hover:bg-gray-200 transition">
15
+ Get Started
16
+ </button>
17
+
18
+ <button className="px-5 py-2 rounded-xl border border-gray-700 text-white hover:bg-gray-900 transition">
19
+ Docs
20
+ </button>
21
+ </div>
22
+ </div>
5
23
  </main>
6
24
  );
7
25
  }
@@ -17,6 +17,11 @@
17
17
  "typescript": "^5.3.0",
18
18
  "@types/react": "^18.2.0",
19
19
  "@types/react-dom": "^18.2.0",
20
- "@types/node": "^20.10.0"
20
+ "@types/node": "^20.10.0",
21
+ "tailwindcss": "^3.4.0",
22
+ "postcss": "^8.4.0",
23
+ "autoprefixer": "^10.4.0"
24
+
25
+
21
26
  }
22
27
  }
@@ -0,0 +1,14 @@
1
+ export default {
2
+ plugins: {
3
+ tailwindcss: {},
4
+ autoprefixer: {}
5
+ }
6
+ };
7
+
8
+
9
+ module.exports = {
10
+ plugins: {
11
+ tailwindcss: {},
12
+ autoprefixer: {}
13
+ }
14
+ };
@@ -14,6 +14,10 @@
14
14
  },
15
15
  "devDependencies": {
16
16
  "@vitejs/plugin-react": "^4.2.0",
17
- "vite": "^5.0.0"
17
+ "vite": "^5.0.0",
18
+ "tailwindcss": "^3.4.0",
19
+ "postcss": "^8.4.0",
20
+ "autoprefixer": "^10.4.0"
21
+
18
22
  }
19
23
  }
@@ -1,8 +1,9 @@
1
1
  export default function App() {
2
2
  return (
3
- <div style={{ padding: "2rem" }}>
4
- <h1>🚀 React App Ready</h1>
5
- <p>Edit <code>App.jsx</code> and start building.</p>
3
+ <div className="min-h-screen flex items-center justify-center bg-black text-white">
4
+ <h1 className="text-3xl font-bold">
5
+ 🚀 Tailwind is working!
6
+ </h1>
6
7
  </div>
7
8
  );
8
9
  }
@@ -0,0 +1,3 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
@@ -16,6 +16,9 @@
16
16
  "@types/react-dom": "^18.2.0",
17
17
  "@vitejs/plugin-react": "^4.2.0",
18
18
  "typescript": "^5.3.0",
19
- "vite": "^5.0.0"
19
+ "vite": "^5.0.0",
20
+ "tailwindcss": "^3.4.0",
21
+ "postcss": "^8.4.0",
22
+ "autoprefixer": "^10.4.0"
20
23
  }
21
24
  }
@@ -1,9 +1,9 @@
1
- function App(): JSX.Element {
1
+ export default function App() {
2
2
  return (
3
- <div style={{ padding: "2rem" }}>
4
- <h1>🚀 React + TypeScript Ready</h1>
3
+ <div className="min-h-screen flex items-center justify-center bg-black text-white">
4
+ <h1 className="text-3xl font-bold">
5
+ 🚀 Tailwind is working!
6
+ </h1>
5
7
  </div>
6
8
  );
7
9
  }
8
-
9
- export default App;
@@ -0,0 +1,3 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
@@ -0,0 +1,21 @@
1
+ /** @type {import('tailwindcss').Config} */
2
+ export default {
3
+ content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
4
+ theme: {
5
+ extend: {}
6
+ },
7
+ plugins: []
8
+ };
9
+
10
+ /** @type {import('tailwindcss').Config} */
11
+ module.exports = {
12
+ content: [
13
+ "./app/**/*.{js,ts,jsx,tsx}",
14
+ "./pages/**/*.{js,ts,jsx,tsx}",
15
+ "./components/**/*.{js,ts,jsx,tsx}"
16
+ ],
17
+ theme: {
18
+ extend: {}
19
+ },
20
+ plugins: []
21
+ };
@@ -73,6 +73,10 @@ export async function createProject(config) {
73
73
  await replacePlaceholders(clientPath, {
74
74
  PROJECT_NAME: config.projectName
75
75
  });
76
+
77
+ installFrontendDependencies(clientPath);
78
+
79
+
76
80
  }
77
81
 
78
82
  /* ----------------------------- Backend --------------------------------- */
@@ -155,3 +159,18 @@ function installDependencies(serverPath, backendFeatures) {
155
159
 
156
160
  injectFeatures(serverPath, backendFeatures);
157
161
  }
162
+
163
+ function installFrontendDependencies(clientPath) {
164
+ // if no frontend selected, skip
165
+ if (!fs.existsSync(path.join(clientPath, "package.json"))) return;
166
+
167
+ const installSpinner = ora("Installing frontend dependencies...").start();
168
+
169
+ execSync("npm install", {
170
+ cwd: clientPath,
171
+ stdio: "ignore"
172
+ });
173
+
174
+ installSpinner.succeed("Frontend dependencies installed ✅");
175
+ }
176
+