create-aziz-app 1.0.3 → 2.0.2
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/create-aziz-app.js +39 -20
- package/package.json +3 -1
- package/template/README.md +189 -0
- package/template/api/hello.js +14 -0
- package/template/api/users.js +62 -0
- package/template/app.config.js +41 -0
- package/template/app.html +127 -24
- package/template/components/Counter.jsx +30 -12
- package/template/components/Footer.jsx +3 -3
- package/template/components/Navbar.jsx +16 -0
- package/template/docs/API-GUIDE.md +196 -0
- package/template/docs/AUTO-IMPORT.md +99 -0
- package/template/docs/GETTING-STARTED.md +205 -0
- package/template/docs/QUICK-START.md +111 -0
- package/template/modules/README.md +129 -0
- package/template/modules/api.js +148 -0
- package/template/modules/auto-import.js +130 -0
- package/template/modules/router.js +185 -0
- package/template/modules/state.js +54 -0
- package/template/package.json +18 -0
- package/template/pages/About.jsx +33 -0
- package/template/pages/ApiDemo.jsx +209 -0
- package/template/pages/Contact.jsx +27 -0
- package/template/pages/Home.jsx +39 -0
- package/template/pages/NewPage.jsx +39 -0
- package/template/pages/Test.jsx +74 -0
- package/template/scripts/build.js +81 -0
- package/template/scripts/dev-server.js +172 -0
- package/template/scripts/generate-imports.js +98 -0
- package/template/app.js +0 -83
- package/template/components/Header.jsx +0 -10
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
const fs = require('fs');
|
|
4
|
+
const path = require('path');
|
|
5
|
+
|
|
6
|
+
console.log('🔍 Auto-generating imports...\n');
|
|
7
|
+
|
|
8
|
+
// Scan a directory for files
|
|
9
|
+
function scanDirectory(dir, extensions = []) {
|
|
10
|
+
const files = [];
|
|
11
|
+
|
|
12
|
+
if (!fs.existsSync(dir)) {
|
|
13
|
+
return files;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
const items = fs.readdirSync(dir);
|
|
17
|
+
|
|
18
|
+
for (const item of items) {
|
|
19
|
+
const fullPath = path.join(dir, item);
|
|
20
|
+
const stat = fs.statSync(fullPath);
|
|
21
|
+
|
|
22
|
+
if (stat.isFile()) {
|
|
23
|
+
const ext = path.extname(item);
|
|
24
|
+
if (extensions.length === 0 || extensions.includes(ext)) {
|
|
25
|
+
files.push(path.relative('.', fullPath).replace(/\\/g, '/'));
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return files;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
// Scan for files
|
|
34
|
+
const apiRoutes = scanDirectory('api', ['.js']);
|
|
35
|
+
const components = scanDirectory('components', ['.jsx', '.js']);
|
|
36
|
+
const pages = scanDirectory('pages', ['.jsx', '.js']);
|
|
37
|
+
|
|
38
|
+
console.log(`📡 Found ${apiRoutes.length} API routes`);
|
|
39
|
+
console.log(`🧩 Found ${components.length} components`);
|
|
40
|
+
console.log(`📄 Found ${pages.length} pages\n`);
|
|
41
|
+
|
|
42
|
+
// Read app.html
|
|
43
|
+
let html = fs.readFileSync('app.html', 'utf8');
|
|
44
|
+
|
|
45
|
+
// Generate script tags
|
|
46
|
+
let scriptTags = ' <!-- Load core modules -->\n';
|
|
47
|
+
scriptTags += ' <script type="text/babel" src="modules/router.js"></script>\n';
|
|
48
|
+
scriptTags += ' <script type="text/babel" src="modules/state.js"></script>\n';
|
|
49
|
+
scriptTags += ' <script type="text/babel" src="modules/api.js"></script>\n\n';
|
|
50
|
+
|
|
51
|
+
if (apiRoutes.length > 0) {
|
|
52
|
+
scriptTags += ' <!-- Load API routes -->\n';
|
|
53
|
+
apiRoutes.forEach(route => {
|
|
54
|
+
scriptTags += ` <script type="text/babel" src="${route}"></script>\n`;
|
|
55
|
+
});
|
|
56
|
+
scriptTags += '\n';
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
if (components.length > 0) {
|
|
60
|
+
scriptTags += ' <!-- Load shared components -->\n';
|
|
61
|
+
components.forEach(component => {
|
|
62
|
+
scriptTags += ` <script type="text/babel" src="${component}"></script>\n`;
|
|
63
|
+
});
|
|
64
|
+
scriptTags += '\n';
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
if (pages.length > 0) {
|
|
68
|
+
scriptTags += ' <!-- Load pages -->\n';
|
|
69
|
+
pages.forEach(page => {
|
|
70
|
+
scriptTags += ` <script type="text/babel" src="${page}"></script>\n`;
|
|
71
|
+
});
|
|
72
|
+
scriptTags += '\n';
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
scriptTags += ' <!-- Start the app -->\n';
|
|
76
|
+
scriptTags += ' <script type="text/babel">\n';
|
|
77
|
+
scriptTags += ' startApp();\n';
|
|
78
|
+
scriptTags += ' </script>';
|
|
79
|
+
|
|
80
|
+
// Replace the scripts section
|
|
81
|
+
const startMarker = ' <!-- Load core modules -->';
|
|
82
|
+
const endMarker = '</script>';
|
|
83
|
+
|
|
84
|
+
const startIndex = html.indexOf(startMarker);
|
|
85
|
+
const endIndex = html.lastIndexOf(endMarker);
|
|
86
|
+
|
|
87
|
+
if (startIndex !== -1 && endIndex !== -1) {
|
|
88
|
+
const before = html.substring(0, startIndex);
|
|
89
|
+
const after = html.substring(endIndex + endMarker.length);
|
|
90
|
+
|
|
91
|
+
html = before + scriptTags + after;
|
|
92
|
+
|
|
93
|
+
fs.writeFileSync('app.html', html);
|
|
94
|
+
console.log('✅ Updated app.html with new imports\n');
|
|
95
|
+
console.log('🎉 Done! Refresh your browser to see changes.');
|
|
96
|
+
} else {
|
|
97
|
+
console.error('❌ Could not find script markers in app.html');
|
|
98
|
+
}
|
package/template/app.js
DELETED
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
/** @jsx h */
|
|
2
|
-
|
|
3
|
-
// ==============================
|
|
4
|
-
// h() — our own createElement
|
|
5
|
-
// Babel compiles JSX like <div class="x"> into h("div", { class: "x" }, ...children)
|
|
6
|
-
// This function turns that into a real DOM element
|
|
7
|
-
// ==============================
|
|
8
|
-
function h(tag, props, ...children) {
|
|
9
|
-
if (typeof tag === "function") {
|
|
10
|
-
return tag(props, ...children);
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
const el = document.createElement(tag);
|
|
14
|
-
|
|
15
|
-
if (props) {
|
|
16
|
-
for (let key in props) {
|
|
17
|
-
if (key.startsWith("on")) {
|
|
18
|
-
const eventName = key.slice(2).toLowerCase();
|
|
19
|
-
el.addEventListener(eventName, props[key]);
|
|
20
|
-
} else if (key === "className") {
|
|
21
|
-
el.className = props[key];
|
|
22
|
-
} else {
|
|
23
|
-
el.setAttribute(key, props[key]);
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
for (let child of children) {
|
|
29
|
-
if (child === null || child === undefined) continue;
|
|
30
|
-
if (typeof child === "string" || typeof child === "number") {
|
|
31
|
-
el.appendChild(document.createTextNode(child));
|
|
32
|
-
} else {
|
|
33
|
-
el.appendChild(child);
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
return el;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
// ==============================
|
|
42
|
-
// STATE
|
|
43
|
-
// ==============================
|
|
44
|
-
let state = {
|
|
45
|
-
count: 0
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
// ==============================
|
|
50
|
-
// RENDER
|
|
51
|
-
// ==============================
|
|
52
|
-
function render() {
|
|
53
|
-
const root = document.getElementById("root");
|
|
54
|
-
root.innerHTML = "";
|
|
55
|
-
root.appendChild(Header());
|
|
56
|
-
root.appendChild(Counter());
|
|
57
|
-
root.appendChild(Footer());
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
// ==============================
|
|
62
|
-
// STATE UPDATER FUNCTIONS
|
|
63
|
-
// ==============================
|
|
64
|
-
function increment() {
|
|
65
|
-
state.count = state.count + 1;
|
|
66
|
-
render();
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
function decrement() {
|
|
70
|
-
state.count = state.count - 1;
|
|
71
|
-
render();
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
function reset() {
|
|
75
|
-
state.count = 0;
|
|
76
|
-
render();
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
// ==============================
|
|
81
|
-
// FIRST RENDER
|
|
82
|
-
// ==============================
|
|
83
|
-
render();
|