@ryziz/create-react 0.0.44 → 0.0.46
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/package.json +2 -2
- package/src/pages.index.jsx +50 -3
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ryziz/create-react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.46",
|
|
4
4
|
"bin": "create-react",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "ryziz dev"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
|
-
"@ryziz/cli": "^0.0.
|
|
9
|
+
"@ryziz/cli": "^0.0.47",
|
|
10
10
|
"@ryziz/router": "^0.0.3",
|
|
11
11
|
"react": "^18.3.1"
|
|
12
12
|
}
|
package/src/pages.index.jsx
CHANGED
|
@@ -1,10 +1,57 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { useState, useEffect } from 'react';
|
|
2
2
|
|
|
3
3
|
export default function Index() {
|
|
4
|
+
const [apiRoot, setApiRoot] = useState(null);
|
|
5
|
+
const [users, setUsers] = useState([]);
|
|
6
|
+
const [post, setPost] = useState(null);
|
|
7
|
+
const [loading, setLoading] = useState(true);
|
|
8
|
+
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
Promise.all([
|
|
11
|
+
fetch('/api/').then((r) => r.json()),
|
|
12
|
+
fetch('/api/users').then((r) => r.json()),
|
|
13
|
+
fetch('/api/posts/1').then((r) => r.json()),
|
|
14
|
+
]).then(([root, usersData, postData]) => {
|
|
15
|
+
setApiRoot(root);
|
|
16
|
+
setUsers(usersData.users);
|
|
17
|
+
setPost(postData.post);
|
|
18
|
+
setLoading(false);
|
|
19
|
+
});
|
|
20
|
+
}, []);
|
|
21
|
+
|
|
22
|
+
if (loading) return <div style={{ textAlign: 'center', marginTop: '50px' }}>Loading...</div>;
|
|
23
|
+
|
|
4
24
|
return (
|
|
5
|
-
<div style={{ fontFamily: 'system-ui, sans-serif',
|
|
6
|
-
<h1>Welcome to Ryziz</h1>
|
|
25
|
+
<div style={{ fontFamily: 'system-ui, sans-serif', maxWidth: '800px', margin: '50px auto', padding: '20px' }}>
|
|
26
|
+
<h1>Welcome to Ryziz Firebase</h1>
|
|
7
27
|
<p>Edit <code>src/pages.index.jsx</code> and save to reload.</p>
|
|
28
|
+
|
|
29
|
+
<div style={{ marginTop: '30px' }}>
|
|
30
|
+
<h2>API Demo</h2>
|
|
31
|
+
|
|
32
|
+
<div style={{ background: '#f5f5f5', padding: '15px', borderRadius: '8px', marginBottom: '20px' }}>
|
|
33
|
+
<h3>API Root (GET /api/)</h3>
|
|
34
|
+
<pre style={{ background: '#fff', padding: '10px', borderRadius: '4px' }}>
|
|
35
|
+
{JSON.stringify(apiRoot, null, 2)}
|
|
36
|
+
</pre>
|
|
37
|
+
</div>
|
|
38
|
+
|
|
39
|
+
<div style={{ background: '#f5f5f5', padding: '15px', borderRadius: '8px', marginBottom: '20px' }}>
|
|
40
|
+
<h3>Users (GET /api/users)</h3>
|
|
41
|
+
<ul style={{ textAlign: 'left' }}>
|
|
42
|
+
{users.map((user) => (
|
|
43
|
+
<li key={user.id}>{user.name}</li>
|
|
44
|
+
))}
|
|
45
|
+
</ul>
|
|
46
|
+
</div>
|
|
47
|
+
|
|
48
|
+
<div style={{ background: '#f5f5f5', padding: '15px', borderRadius: '8px', marginBottom: '20px' }}>
|
|
49
|
+
<h3>Post (GET /api/posts/1)</h3>
|
|
50
|
+
<pre style={{ background: '#fff', padding: '10px', borderRadius: '4px' }}>
|
|
51
|
+
{JSON.stringify(post, null, 2)}
|
|
52
|
+
</pre>
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
8
55
|
</div>
|
|
9
56
|
);
|
|
10
57
|
}
|