@nitronjs/framework 0.1.23 → 0.2.0

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.
Files changed (37) hide show
  1. package/lib/Build/CssBuilder.js +129 -0
  2. package/lib/Build/FileAnalyzer.js +395 -0
  3. package/lib/Build/HydrationBuilder.js +173 -0
  4. package/lib/Build/Manager.js +290 -936
  5. package/lib/Build/colors.js +10 -0
  6. package/lib/Build/jsxRuntime.js +116 -0
  7. package/lib/Build/plugins.js +264 -0
  8. package/lib/Console/Commands/BuildCommand.js +6 -5
  9. package/lib/Console/Commands/DevCommand.js +151 -311
  10. package/lib/Console/Stubs/page-hydration-dev.tsx +72 -0
  11. package/lib/Console/Stubs/page-hydration.tsx +15 -16
  12. package/lib/Console/Stubs/vendor-dev.tsx +50 -0
  13. package/lib/Core/Environment.js +29 -2
  14. package/lib/Core/Paths.js +12 -4
  15. package/lib/Database/Drivers/MySQLDriver.js +5 -4
  16. package/lib/Database/QueryBuilder.js +2 -3
  17. package/lib/Filesystem/Manager.js +32 -7
  18. package/lib/HMR/Server.js +87 -0
  19. package/lib/Http/Server.js +9 -5
  20. package/lib/Logging/Manager.js +68 -18
  21. package/lib/Route/Loader.js +3 -4
  22. package/lib/Route/Manager.js +24 -3
  23. package/lib/Runtime/Entry.js +26 -1
  24. package/lib/Session/File.js +18 -7
  25. package/lib/View/Client/hmr-client.js +166 -0
  26. package/lib/View/Client/spa.js +142 -0
  27. package/lib/View/Layout.js +94 -0
  28. package/lib/View/Manager.js +390 -46
  29. package/lib/index.d.ts +55 -0
  30. package/package.json +2 -1
  31. package/skeleton/.env.example +0 -2
  32. package/skeleton/app/Controllers/HomeController.js +27 -3
  33. package/skeleton/config/app.js +15 -14
  34. package/skeleton/config/session.js +1 -1
  35. package/skeleton/globals.d.ts +3 -63
  36. package/skeleton/resources/views/Site/Home.tsx +274 -50
  37. package/skeleton/tsconfig.json +5 -1
@@ -5,20 +5,21 @@ export default {
5
5
  /**
6
6
  * Content Security Policy (CSP) Whitelist
7
7
  *
8
- * Add trusted external domains for each resource type.
9
- * These will be appended to the default secure CSP policy.
8
+ * Format 1 - Simple URL array (applies to all resource types):
9
+ * csp: ["https://fonts.googleapis.com", "https://fonts.gstatic.com"]
10
10
  *
11
- * Examples:
12
- * - Google Fonts: styles: ["https://fonts.googleapis.com"], fonts: ["https://fonts.gstatic.com"]
13
- * - Cloudflare CDN: scripts: ["https://cdnjs.cloudflare.com"]
14
- * - Google Analytics: scripts: ["https://www.googletagmanager.com"], connect: ["https://www.google-analytics.com"]
11
+ * Format 2 - Wildcard (allows all external resources - not recommended for production):
12
+ * csp: ["*"]
13
+ *
14
+ * Format 3 - Detailed per-type configuration:
15
+ * csp: {
16
+ * styles: ["https://fonts.googleapis.com"],
17
+ * fonts: ["https://fonts.gstatic.com"],
18
+ * scripts: ["https://cdnjs.cloudflare.com"],
19
+ * images: [],
20
+ * connect: [],
21
+ * frames: [],
22
+ * }
15
23
  */
16
- csp: {
17
- styles: [],
18
- fonts: [],
19
- images: [],
20
- scripts: [],
21
- connect: [],
22
- frames: [],
23
- },
24
+ csp: [],
24
25
  }
@@ -6,7 +6,7 @@ export default {
6
6
  cookieName: "session",
7
7
  cookie: {
8
8
  httpOnly: true,
9
- secure: process.env.APP_DEV !== "true",
9
+ secure: false, // Set to true in production with HTTPS
10
10
  sameSite: "lax",
11
11
  path: "/",
12
12
  maxAge: SESSION_LIFETIME
@@ -1,68 +1,8 @@
1
1
  /**
2
2
  * NitronJS Global Types
3
3
  *
4
- * Framework types are provided by @nitronjs/framework package.
5
- * This file only contains global function declarations.
4
+ * This file imports global type declarations from the framework.
5
+ * All global functions (csrf, route, request) are available without import.
6
6
  */
7
7
 
8
- /**
9
- * Returns the CSRF token for the current request.
10
- * Works on both SSR and client-side.
11
- *
12
- * @example
13
- * // In a form
14
- * <input type="hidden" name="_csrf" value={csrf()} />
15
- *
16
- * // In a fetch request
17
- * fetch('/api/action', {
18
- * method: 'POST',
19
- * headers: { 'X-CSRF-Token': csrf() }
20
- * })
21
- */
22
- declare function csrf(): string;
23
-
24
- /**
25
- * Returns the URL for a named route.
26
- * Works on both SSR and client-side.
27
- *
28
- * @param name - The route name as defined in routes/web.js
29
- * @param params - Optional route parameters
30
- * @example
31
- * <a href={route('home')}>Home</a>
32
- * <a href={route('admin.dashboard')}>Dashboard</a>
33
- * <a href={route('admin.users.edit', { id: 1 })}>Edit User</a>
34
- */
35
- declare function route(name: string, params?: Record<string, any>): string;
36
-
37
- /**
38
- * Returns the current request object.
39
- * Only works in Server Components during SSR.
40
- *
41
- * @example
42
- * // Get query parameters
43
- * const tab = request().query.tab || 'general';
44
- *
45
- * // Get URL parameters
46
- * const id = request().params.id;
47
- *
48
- * // Get request method
49
- * const method = request().method;
50
- */
51
- declare function request(): {
52
- path: string;
53
- method: string;
54
- query: Record<string, any>;
55
- params: Record<string, any>;
56
- body: Record<string, any>;
57
- headers: Record<string, string>;
58
- cookies: Record<string, string>;
59
- ip: string;
60
- isAjax: boolean;
61
- session: {
62
- get<T = any>(key: string, defaultValue?: T): T;
63
- set(key: string, value: any): void;
64
- has(key: string): boolean;
65
- forget(key: string): void;
66
- flash(key: string, value: any): void;
67
- };
68
- };
8
+ /// <reference types="@nitronjs/framework" />
@@ -1,66 +1,290 @@
1
+ type Feature = {
2
+ icon: string;
3
+ title: string;
4
+ description: string;
5
+ };
6
+
1
7
  type HomeProps = {
2
- name?: string;
8
+ title?: string;
9
+ features?: Feature[];
3
10
  };
4
11
 
5
- export default function Home({ name = "NitronJS" }: HomeProps) {
12
+ export default function Home({ title = "Welcome to NitronJS", features = [] }: HomeProps) {
6
13
  return (
7
14
  <main style={{
8
15
  minHeight: "100vh",
9
- display: "flex",
10
- flexDirection: "column",
11
- alignItems: "center",
12
- justifyContent: "center",
13
- gap: "1.5rem",
14
- color: "#fff",
15
- background: "radial-gradient(circle at top, #111827, #0b0f19)",
16
- fontFamily: "system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif",
17
- padding: "4rem 1.5rem"
16
+ background: "linear-gradient(135deg, #0f0f23 0%, #1a1a3e 50%, #0f172a 100%)",
17
+ fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif",
18
+ color: "#e4e4e7",
19
+ overflow: "hidden"
18
20
  }}>
19
- <h1 style={{
20
- fontSize: "3.5rem",
21
- lineHeight: "1.1",
22
- margin: 0,
21
+ {/* Background decoration */}
22
+ <div style={{
23
+ position: "fixed",
24
+ top: 0,
25
+ left: 0,
26
+ right: 0,
27
+ bottom: 0,
28
+ background: "radial-gradient(circle at 20% 20%, rgba(99, 102, 241, 0.15) 0%, transparent 50%), radial-gradient(circle at 80% 80%, rgba(139, 92, 246, 0.1) 0%, transparent 50%)",
29
+ pointerEvents: "none"
30
+ }} />
31
+
32
+ {/* Hero Section */}
33
+ <section style={{
34
+ minHeight: "100vh",
35
+ display: "flex",
36
+ flexDirection: "column",
37
+ alignItems: "center",
38
+ justifyContent: "center",
39
+ padding: "2rem",
40
+ position: "relative",
23
41
  textAlign: "center"
24
42
  }}>
25
- Welcome to {name}
26
- </h1>
27
- <p style={{
28
- maxWidth: "680px",
29
- textAlign: "center",
30
- color: "#94a3b8",
31
- margin: 0,
32
- fontSize: "1.125rem"
43
+ {/* Logo */}
44
+ <div style={{
45
+ width: 80,
46
+ height: 80,
47
+ background: "linear-gradient(135deg, #6366f1, #8b5cf6)",
48
+ borderRadius: 20,
49
+ display: "flex",
50
+ alignItems: "center",
51
+ justifyContent: "center",
52
+ marginBottom: "2rem",
53
+ boxShadow: "0 20px 60px rgba(99, 102, 241, 0.4)"
54
+ }}>
55
+ <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="#fff" strokeWidth="2">
56
+ <path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/>
57
+ </svg>
58
+ </div>
59
+
60
+ {/* Title */}
61
+ <h1 style={{
62
+ fontSize: "clamp(2.5rem, 8vw, 4.5rem)",
63
+ fontWeight: 800,
64
+ margin: 0,
65
+ background: "linear-gradient(135deg, #fff 0%, #a1a1aa 100%)",
66
+ WebkitBackgroundClip: "text",
67
+ WebkitTextFillColor: "transparent",
68
+ letterSpacing: "-0.02em",
69
+ lineHeight: 1.1
70
+ }}>
71
+ {title}
72
+ </h1>
73
+
74
+ {/* Subtitle */}
75
+ <p style={{
76
+ fontSize: "clamp(1rem, 2.5vw, 1.25rem)",
77
+ color: "#71717a",
78
+ maxWidth: 600,
79
+ margin: "1.5rem 0 2.5rem",
80
+ lineHeight: 1.7
81
+ }}>
82
+ Build modern, full-stack web applications with React SSR,
83
+ MVC architecture, and developer-friendly tooling.
84
+ </p>
85
+
86
+ {/* CTA Buttons */}
87
+ <div style={{
88
+ display: "flex",
89
+ gap: "1rem",
90
+ flexWrap: "wrap",
91
+ justifyContent: "center"
92
+ }}>
93
+ <a href="https://nitronjs.dev/docs" style={{
94
+ display: "inline-flex",
95
+ alignItems: "center",
96
+ gap: "0.5rem",
97
+ padding: "0.875rem 1.75rem",
98
+ background: "linear-gradient(135deg, #6366f1, #8b5cf6)",
99
+ color: "#fff",
100
+ textDecoration: "none",
101
+ fontWeight: 600,
102
+ fontSize: "0.95rem",
103
+ borderRadius: 12,
104
+ boxShadow: "0 4px 20px rgba(99, 102, 241, 0.4)",
105
+ transition: "transform 0.2s, box-shadow 0.2s"
106
+ }}>
107
+ Get Started
108
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
109
+ <path d="M5 12h14M12 5l7 7-7 7"/>
110
+ </svg>
111
+ </a>
112
+ <a href="https://github.com/nicatdursunlu/nitronjs" style={{
113
+ display: "inline-flex",
114
+ alignItems: "center",
115
+ gap: "0.5rem",
116
+ padding: "0.875rem 1.75rem",
117
+ background: "rgba(255, 255, 255, 0.05)",
118
+ color: "#e4e4e7",
119
+ textDecoration: "none",
120
+ fontWeight: 600,
121
+ fontSize: "0.95rem",
122
+ borderRadius: 12,
123
+ border: "1px solid rgba(255, 255, 255, 0.1)",
124
+ transition: "background 0.2s, border-color 0.2s"
125
+ }}>
126
+ <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor">
127
+ <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/>
128
+ </svg>
129
+ GitHub
130
+ </a>
131
+ </div>
132
+
133
+ {/* Scroll indicator */}
134
+ <div style={{
135
+ position: "absolute",
136
+ bottom: "2rem",
137
+ display: "flex",
138
+ flexDirection: "column",
139
+ alignItems: "center",
140
+ gap: "0.5rem",
141
+ color: "#52525b",
142
+ fontSize: "0.75rem"
143
+ }}>
144
+ <span>Scroll to explore</span>
145
+ <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
146
+ <path d="M12 5v14M5 12l7 7 7-7"/>
147
+ </svg>
148
+ </div>
149
+ </section>
150
+
151
+ {/* Features Section */}
152
+ <section style={{
153
+ padding: "6rem 2rem",
154
+ maxWidth: 1200,
155
+ margin: "0 auto"
33
156
  }}>
34
- Your project is ready. Start building pages with React SSR and the NitronJS MVC structure.
35
- </p>
36
- <div style={{
37
- display: "flex",
38
- gap: "0.75rem",
39
- flexWrap: "wrap",
40
- justifyContent: "center"
157
+ <h2 style={{
158
+ fontSize: "clamp(1.75rem, 4vw, 2.5rem)",
159
+ fontWeight: 700,
160
+ textAlign: "center",
161
+ margin: "0 0 1rem",
162
+ color: "#fff"
163
+ }}>
164
+ Why NitronJS?
165
+ </h2>
166
+ <p style={{
167
+ textAlign: "center",
168
+ color: "#71717a",
169
+ maxWidth: 500,
170
+ margin: "0 auto 4rem",
171
+ fontSize: "1.1rem"
172
+ }}>
173
+ Everything you need to build production-ready applications
174
+ </p>
175
+
176
+ <div style={{
177
+ display: "grid",
178
+ gridTemplateColumns: "repeat(auto-fit, minmax(260px, 1fr))",
179
+ gap: "1.5rem"
180
+ }}>
181
+ {features.map((feature, index) => (
182
+ <div key={index} style={{
183
+ padding: "2rem",
184
+ background: "linear-gradient(145deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01))",
185
+ border: "1px solid rgba(255,255,255,0.06)",
186
+ borderRadius: 16,
187
+ transition: "transform 0.2s, border-color 0.2s"
188
+ }}>
189
+ <div style={{
190
+ width: 48,
191
+ height: 48,
192
+ background: "linear-gradient(135deg, rgba(99,102,241,0.2), rgba(139,92,246,0.1))",
193
+ borderRadius: 12,
194
+ display: "flex",
195
+ alignItems: "center",
196
+ justifyContent: "center",
197
+ fontSize: "1.5rem",
198
+ marginBottom: "1.25rem"
199
+ }}>
200
+ {feature.icon}
201
+ </div>
202
+ <h3 style={{
203
+ fontSize: "1.125rem",
204
+ fontWeight: 600,
205
+ margin: "0 0 0.75rem",
206
+ color: "#fff"
207
+ }}>
208
+ {feature.title}
209
+ </h3>
210
+ <p style={{
211
+ fontSize: "0.9rem",
212
+ color: "#71717a",
213
+ margin: 0,
214
+ lineHeight: 1.6
215
+ }}>
216
+ {feature.description}
217
+ </p>
218
+ </div>
219
+ ))}
220
+ </div>
221
+ </section>
222
+
223
+ {/* Code Example Section */}
224
+ <section style={{
225
+ padding: "4rem 2rem 6rem",
226
+ maxWidth: 800,
227
+ margin: "0 auto"
41
228
  }}>
42
- <a href="https://nitronjs.dev/docs" style={{
43
- padding: "0.75rem 1.5rem",
44
- borderRadius: "10px",
45
- background: "#3b82f6",
46
- color: "#fff",
47
- textDecoration: "none",
48
- fontWeight: 600
229
+ <h2 style={{
230
+ fontSize: "clamp(1.5rem, 3vw, 2rem)",
231
+ fontWeight: 700,
232
+ textAlign: "center",
233
+ margin: "0 0 2rem",
234
+ color: "#fff"
235
+ }}>
236
+ Start Building
237
+ </h2>
238
+ <div style={{
239
+ background: "#0d0d1a",
240
+ border: "1px solid rgba(255,255,255,0.08)",
241
+ borderRadius: 16,
242
+ overflow: "hidden"
49
243
  }}>
50
- Documentation
51
- </a>
52
- <a href="https://nitronjs.dev" style={{
53
- padding: "0.75rem 1.5rem",
54
- borderRadius: "10px",
55
- background: "transparent",
56
- color: "#e2e8f0",
57
- textDecoration: "none",
58
- border: "1px solid #334155",
59
- fontWeight: 600
244
+ <div style={{
245
+ padding: "1rem 1.25rem",
246
+ borderBottom: "1px solid rgba(255,255,255,0.06)",
247
+ display: "flex",
248
+ alignItems: "center",
249
+ gap: "0.5rem"
250
+ }}>
251
+ <span style={{ width: 12, height: 12, borderRadius: "50%", background: "#ef4444" }} />
252
+ <span style={{ width: 12, height: 12, borderRadius: "50%", background: "#fbbf24" }} />
253
+ <span style={{ width: 12, height: 12, borderRadius: "50%", background: "#4ade80" }} />
254
+ <span style={{ marginLeft: "auto", color: "#52525b", fontSize: "0.8rem" }}>Terminal</span>
255
+ </div>
256
+ <pre style={{
257
+ margin: 0,
258
+ padding: "1.5rem",
259
+ fontSize: "0.9rem",
260
+ lineHeight: 1.8,
261
+ overflowX: "auto"
262
+ }}>
263
+ <code style={{ color: "#a1a1aa" }}>
264
+ <span style={{ color: "#71717a" }}># Create a new project</span>{"\n"}
265
+ <span style={{ color: "#4ade80" }}>npx</span> @nitronjs/framework my-app{"\n\n"}
266
+ <span style={{ color: "#71717a" }}># Start development server</span>{"\n"}
267
+ <span style={{ color: "#4ade80" }}>cd</span> my-app{"\n"}
268
+ <span style={{ color: "#4ade80" }}>npm</span> run dev
269
+ </code>
270
+ </pre>
271
+ </div>
272
+ </section>
273
+
274
+ {/* Footer */}
275
+ <footer style={{
276
+ padding: "3rem 2rem",
277
+ borderTop: "1px solid rgba(255,255,255,0.05)",
278
+ textAlign: "center"
279
+ }}>
280
+ <p style={{
281
+ margin: 0,
282
+ color: "#52525b",
283
+ fontSize: "0.875rem"
60
284
  }}>
61
- Website
62
- </a>
63
- </div>
285
+ Built with ⚡ NitronJS — The Modern Full-Stack Framework
286
+ </p>
287
+ </footer>
64
288
  </main>
65
289
  );
66
290
  }
@@ -10,7 +10,11 @@
10
10
  "esModuleInterop": true,
11
11
  "skipLibCheck": true,
12
12
  "forceConsistentCasingInFileNames": true,
13
- "noEmit": true
13
+ "noEmit": true,
14
+ "baseUrl": ".",
15
+ "paths": {
16
+ "@/*": ["./*"]
17
+ }
14
18
  },
15
19
  "include": [
16
20
  "./globals.d.ts",