|
1 |
| -# Portfolio Site |
| 1 | +# Astro Starter Kit: Basics |
2 | 2 |
|
3 |
| -Portfolio site build with [nuxt 3](https://v3.nuxtjs.org) |
4 |
| - |
5 |
| -## Setup |
| 3 | +```sh |
| 4 | +npm create astro@latest -- --template basics |
| 5 | +``` |
6 | 6 |
|
7 |
| -Make sure to install the dependencies: |
| 7 | +[](https://stackblitz.com/github/withastro/astro/tree/latest/examples/basics) |
| 8 | +[](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/basics) |
| 9 | +[](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/basics/devcontainer.json) |
8 | 10 |
|
9 |
| -```bash |
10 |
| -# npm |
11 |
| -npm install |
| 11 | +> π§βπ **Seasoned astronaut?** Delete this file. Have fun! |
12 | 12 |
|
13 |
| -# pnpm |
14 |
| -pnpm install --shamefully-hoist |
15 |
| -``` |
| 13 | + |
16 | 14 |
|
17 |
| -## Development Server |
| 15 | +## π Project Structure |
18 | 16 |
|
19 |
| -Start the development server on http://localhost:3000 |
| 17 | +Inside of your Astro project, you'll see the following folders and files: |
20 | 18 |
|
21 |
| -```bash |
22 |
| -npm run dev |
| 19 | +```text |
| 20 | +/ |
| 21 | +βββ public/ |
| 22 | +β βββ favicon.svg |
| 23 | +βββ src/ |
| 24 | +β βββ components/ |
| 25 | +β β βββ Card.astro |
| 26 | +β βββ layouts/ |
| 27 | +β β βββ Layout.astro |
| 28 | +β βββ pages/ |
| 29 | +β βββ index.astro |
| 30 | +βββ package.json |
23 | 31 | ```
|
24 | 32 |
|
25 |
| -## Production |
| 33 | +Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. |
26 | 34 |
|
27 |
| -Build the application for production: |
| 35 | +There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. |
28 | 36 |
|
29 |
| -```bash |
30 |
| -npm run build |
31 |
| -``` |
32 |
| - |
33 |
| -Locally preview production build: |
| 37 | +Any static assets, like images, can be placed in the `public/` directory. |
34 | 38 |
|
35 |
| -```bash |
36 |
| -npm run preview |
37 |
| -``` |
| 39 | +## π§ Commands |
38 | 40 |
|
39 |
| -Checkout the [deployment documentation](https://v3.nuxtjs.org/guide/deploy/presets) for more information. |
| 41 | +All commands are run from the root of the project, from a terminal: |
40 | 42 |
|
41 |
| -## API |
| 43 | +| Command | Action | |
| 44 | +| :------------------------ | :----------------------------------------------- | |
| 45 | +| `npm install` | Installs dependencies | |
| 46 | +| `npm run dev` | Starts local dev server at `localhost:4321` | |
| 47 | +| `npm run build` | Build your production site to `./dist/` | |
| 48 | +| `npm run preview` | Preview your build locally, before deploying | |
| 49 | +| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | |
| 50 | +| `npm run astro -- --help` | Get help using the Astro CLI | |
42 | 51 |
|
43 |
| -### tile.png |
| 52 | +## π Want to learn more? |
44 | 53 |
|
45 |
| -An endpoint to generate tiles with text and/or emojis. \ |
46 |
| -To use this endpoint goto [schelpkikker.nl/api/tile.png?content=lorem%20ipsum](https://schelpkikker.nl/api/tile.png?content=lorem%20ipsum) where everything after the `?content=` can be an [uri encoded](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI) string |
| 54 | +Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat). |
0 commit comments