Skip to content

Commit ed7b78e

Browse files
committed
feat: Add demo
1 parent 45cee7e commit ed7b78e

File tree

9 files changed

+4505
-0
lines changed

9 files changed

+4505
-0
lines changed

demo/.gitignore

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# build output
2+
dist/
3+
# generated types
4+
.astro/
5+
6+
# dependencies
7+
node_modules/
8+
9+
# logs
10+
npm-debug.log*
11+
yarn-debug.log*
12+
yarn-error.log*
13+
pnpm-debug.log*
14+
15+
16+
# environment variables
17+
.env
18+
.env.production
19+
20+
# macOS-specific files
21+
.DS_Store
22+
23+
# jetbrains setting folder
24+
.idea/
25+
26+
# yarn
27+
.yarn/*
28+
!.yarn/releases
29+
!.yarn/plugins
30+
.pnp.*

demo/README.md

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
# Astro Starter Kit: Minimal
2+
3+
```sh
4+
npm create astro@latest -- --template minimal
5+
```
6+
7+
[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
8+
[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
9+
[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
10+
11+
> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
12+
13+
## 🚀 Project Structure
14+
15+
Inside of your Astro project, you'll see the following folders and files:
16+
17+
```text
18+
/
19+
├── public/
20+
├── src/
21+
│ └── pages/
22+
│ └── index.astro
23+
└── package.json
24+
```
25+
26+
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
27+
28+
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
29+
30+
Any static assets, like images, can be placed in the `public/` directory.
31+
32+
## 🧞 Commands
33+
34+
All commands are run from the root of the project, from a terminal:
35+
36+
| Command | Action |
37+
| :------------------------ | :----------------------------------------------- |
38+
| `npm install` | Installs dependencies |
39+
| `npm run dev` | Starts local dev server at `localhost:4321` |
40+
| `npm run build` | Build your production site to `./dist/` |
41+
| `npm run preview` | Preview your build locally, before deploying |
42+
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
43+
| `npm run astro -- --help` | Get help using the Astro CLI |
44+
45+
## 👀 Want to learn more?
46+
47+
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

demo/astro.config.mjs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// @ts-check
2+
import { defineConfig } from 'astro/config';
3+
4+
// https://astro.build/config
5+
export default defineConfig({});

demo/package.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"name": "demo",
3+
"type": "module",
4+
"version": "0.0.1",
5+
"scripts": {
6+
"dev": "astro dev",
7+
"build": "astro build",
8+
"preview": "astro preview",
9+
"astro": "astro"
10+
},
11+
"dependencies": {
12+
"astro": "^5.3.0",
13+
"astro-qiita-loader": "../"
14+
}
15+
}

demo/public/favicon.svg

Lines changed: 9 additions & 0 deletions
Loading

demo/src/content.config.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { defineCollection, z } from "astro:content";
2+
import { qiitaLoader } from "astro-qiita-loader";
3+
4+
const qiitas = defineCollection({
5+
loader: qiitaLoader({
6+
url: "https://qiita.com//api/v2/items",
7+
}),
8+
});
9+
10+
export const collections = {
11+
qiitas,
12+
};

demo/src/pages/index.astro

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
---
2+
import { getCollection, type CollectionEntry } from "astro:content";
3+
4+
const qiitas: CollectionEntry<"qiitas">[] = await getCollection("qiitas");
5+
---
6+
7+
<html lang="ja">
8+
<head>
9+
<meta charset="utf-8" />
10+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
11+
<meta name="viewport" content="width=device-width" />
12+
<meta name="generator" content={Astro.generator} />
13+
<title>Qiita 記事一覧</title>
14+
</head>
15+
<body>
16+
<h1>Qiita 記事一覧</h1>
17+
<table>
18+
<thead>
19+
<tr>
20+
<th>タイトル</th>
21+
<th>作成日</th>
22+
<th>いいね数</th>
23+
<th>タグ</th>
24+
</tr>
25+
</thead>
26+
<tbody>
27+
{
28+
qiitas.map((qiita) => (
29+
<tr>
30+
<td>
31+
<a href={qiita.data.url} target="_blank" rel="noopener">
32+
{qiita.data.title}
33+
</a>
34+
</td>
35+
<td>
36+
{new Date(qiita.data.created_at).toLocaleDateString("ja-JP")}
37+
</td>
38+
<td>{qiita.data.likes_count}</td>
39+
<td>
40+
{qiita.data.tags.map((tag) => (
41+
<span class="tag">{tag.name}</span>
42+
))}
43+
</td>
44+
</tr>
45+
))
46+
}
47+
</tbody>
48+
</table>
49+
50+
<style>
51+
table {
52+
border-collapse: collapse;
53+
width: 100%;
54+
margin: 1rem 0;
55+
}
56+
th,
57+
td {
58+
border: 1px solid #ddd;
59+
padding: 8px;
60+
text-align: left;
61+
}
62+
th {
63+
background-color: #f5f5f5;
64+
}
65+
.tag {
66+
display: inline-block;
67+
background-color: #e9ecef;
68+
padding: 2px 8px;
69+
border-radius: 4px;
70+
margin: 2px;
71+
font-size: 0.9em;
72+
}
73+
a {
74+
color: #55c500;
75+
text-decoration: none;
76+
}
77+
a:hover {
78+
text-decoration: underline;
79+
}
80+
</style>
81+
</body>
82+
</html>

demo/tsconfig.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"extends": "astro/tsconfigs/strict",
3+
"include": [".astro/types.d.ts", "**/*"],
4+
"exclude": ["dist"]
5+
}

0 commit comments

Comments
 (0)