Fix typos in the docs/ content (#1093)
Co-authored-by: mundry <mundry@users.noreply.github.com>
This commit is contained in:
mundry
GitHub
parent
fbbb589d92
commit
cbae535cad
8 changed files with 14 additions and 14 deletions
|
|
@ -7,7 +7,7 @@ Astro uses **file-based routing** to generate your build URLs based on the file
|
|||
|
||||
## Static routes
|
||||
|
||||
Astro Components (`.astro`) and Markdown Files (`.md`) in the `src/pages` directory become pages on your website. Each page's route is decided based on it's filename and path within the `src/pages` directory. This means that there is no separate "routing config" to maintain in an Astro project.
|
||||
Astro Components (`.astro`) and Markdown Files (`.md`) in the `src/pages` directory become pages on your website. Each page's route is decided based on its filename and path within the `src/pages` directory. This means that there is no separate "routing config" to maintain in an Astro project.
|
||||
|
||||
```bash
|
||||
# Example: Static routes
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ Es kommen eine Menge verschiedener Menschen mit unterschiedlichen Hintergründen
|
|||
|
||||
- Falls du lieber **theoretisch lernst**, kannst du mit unseren [grundlegenden Konzepten und Anleitungen](/core-concepts/project-structure) anfangen.
|
||||
|
||||
Wie alle unbekannten Technologien, hat auch Astro einen leichte Lernkurve. Mit ein bisschen Übung und Geduld, sind wir aber _sicher_, dass du schnell lernst, wie du mit Astro umgehen kannst.
|
||||
Wie alle unbekannten Technologien, hat auch Astro eine leichte Lernkurve. Mit ein bisschen Übung und Geduld, sind wir aber _sicher_, dass du schnell lernst, wie du mit Astro umgehen kannst.
|
||||
|
||||
### Lerne die `.astro` Syntax
|
||||
|
||||
|
|
@ -56,7 +56,7 @@ Unser [@astrodotbuild](https://twitter.com/astrodotbuild) Twitter Account ist di
|
|||
|
||||
Zusätzlich veröffentlichen wir alle Release Ankündigungen in unserer [Discord Community](https://astro.build/chat) im `#announcements` Kanal.
|
||||
|
||||
Obwohl nicht jeder Astro Release einenen eigenen Blogpost verdient, kannst du alle Änderungen für jedes Release in unserem detaillierten [`CHANGELOG.md` im Astro Repository](https://github.com/snowpackjs/astro/blob/main/packages/astro/CHANGELOG.md) nachlesen.
|
||||
Obwohl nicht jeder Astro Release einen eigenen Blogpost verdient, kannst du alle Änderungen für jedes Release in unserem detaillierten [`CHANGELOG.md` im Astro Repository](https://github.com/snowpackjs/astro/blob/main/packages/astro/CHANGELOG.md) nachlesen.
|
||||
|
||||
## Fehlt etwas?
|
||||
|
||||
|
|
|
|||
|
|
@ -68,15 +68,15 @@ By default, the build output will be placed at `dist/`. You may deploy this `dis
|
|||
|
||||
### GitHub Actions
|
||||
|
||||
1. In the astro project repo, create `gh-pages` branch then go to Settings > Pages and set to `gh-pages` branch for Github Pages and set directory to `/` (root).
|
||||
1. In the astro project repo, create `gh-pages` branch then go to Settings > Pages and set to `gh-pages` branch for GitHub Pages and set directory to `/` (root).
|
||||
2. Set the correct `buildOptions.site` in `astro.config.mjs`.
|
||||
3. Create the file `.github/workflows/main.yml` and add in the yaml below. Make sure to edit in your own details.
|
||||
4. In Github go to Settings > Developer settings > Personal Access tokens. Generate a new token with repo permissions.
|
||||
4. In GitHub go to Settings > Developer settings > Personal Access tokens. Generate a new token with repo permissions.
|
||||
5. In the astro project repo (not \<YOUR USERNAME\>.github.io) go to Settings > Secrets and add your new personal access token with the name `API_TOKEN_GITHUB`.
|
||||
6. When you push changes to the astro project repo CI will deploy them to \<YOUR USERNAME\>.github.io for you.
|
||||
|
||||
```yaml
|
||||
# Workflow to build and deploy to your Github Pages repo.
|
||||
# Workflow to build and deploy to your GitHub Pages repo.
|
||||
|
||||
# Edit your project details here.
|
||||
# Remember to add API_TOKEN_GITHUB in repo Settings > Secrets as well!
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ title: RSS
|
|||
|
||||
Astro supports fast, automatic RSS feed generation for blogs and other content websites.
|
||||
|
||||
You can create an RSS feed from any Astro page that uses a `getStaticPaths()` function for routing. Only dynamic routes can use `getStaticPaths()` today (see [Routing](/core-concepts/routing).
|
||||
You can create an RSS feed from any Astro page that uses a `getStaticPaths()` function for routing. Only dynamic routes can use `getStaticPaths()` today (see [Routing](/core-concepts/routing)).
|
||||
|
||||
> We hope to make this feature available to all other pages before v1.0. As a workaround, you can convert a static route to a dynamic route that only generates a single page. See [Routing](/core-concepts/routing) for more information about dynamic routes.
|
||||
|
||||
|
|
|
|||
|
|
@ -272,7 +272,7 @@ import Button from './Button.astro';
|
|||
</nav>
|
||||
```
|
||||
|
||||
This is undesirable because now `<Nav>` and `<Button>` fight over what the final button looks like. Now, whenever you edit one, you'll always have to edit the other, and they are no longer truly isolated as they once were (now coupled by a bidirectional styling dependency). It's easy to see how this pattern only has to repeated a couple times before being afraid that touching any styles _anywhere_ may break styling in a completely different part of the app (queue `peter-griffin-css-blinds.gif`).
|
||||
This is undesirable because now `<Nav>` and `<Button>` fight over what the final button looks like. Now, whenever you edit one, you'll always have to edit the other, and they are no longer truly isolated as they once were (now coupled by a bidirectional styling dependency). It's easy to see how this pattern only has to be repeated a couple times before being afraid that touching any styles _anywhere_ may break styling in a completely different part of the app (queue `peter-griffin-css-blinds.gif`).
|
||||
|
||||
Instead, let `<Button>` control its own styles, and try a prop:
|
||||
|
||||
|
|
@ -303,7 +303,7 @@ Elsewhere, you can use `<Button theme="nav">` to set the type of button it is. T
|
|||
|
||||
Recently there has been a debate of all-scoped component styles vs utility-only CSS. But we agree with people like Sarah Dayan who ask [why can't we have both][utility-css]? Truth is that while having scoped component styles are great, there are still hundreds of times when the website's coming together when two components just don't line up _quite_ right, and one needs a nudge. Or different text treatment is needed in one component instance.
|
||||
|
||||
While the thought of having perfect, pristine components is nice, it's unrealistic. No design system is absoutely perfect, and every design system has inconsistencies. And it's in reconciling these inconsistencies where components can become a mess without utility CSS. Utility CSS is great for adding minor tweaks necessary to get the website out the door. But they also are incomplete on their own—if you've ever tried to manage responsive styles or accessible focus states with utility CSS it can quickly become a mess! **Utility CSS works best in partnership with component (scoped) CSS**. And in order to be as easy as possible to use, Utility CSS should be global (arguably should be your only global CSS, besides maybe reset.css) so you don't have to deal with imports all willy-nilly.
|
||||
While the thought of having perfect, pristine components is nice, it's unrealistic. No design system is absolutely perfect, and every design system has inconsistencies. And it's in reconciling these inconsistencies where components can become a mess without utility CSS. Utility CSS is great for adding minor tweaks necessary to get the website out the door. But they also are incomplete on their own—if you've ever tried to manage responsive styles or accessible focus states with utility CSS it can quickly become a mess! **Utility CSS works best in partnership with component (scoped) CSS**. And in order to be as easy as possible to use, Utility CSS should be global (arguably should be your only global CSS, besides maybe reset.css) so you don't have to deal with imports all willy-nilly.
|
||||
|
||||
Some great problems best handled with Utility CSS are:
|
||||
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ npm init astro
|
|||
yarn create astro
|
||||
```
|
||||
|
||||
[`create-astro`](https://github.com/snowpackjs/astro/tree/main/packages/create-astro) wizard lets you choose from a set of [starter templates](/examples) or alternatively, you could import your own Astro project directly from Github.
|
||||
[`create-astro`](https://github.com/snowpackjs/astro/tree/main/packages/create-astro) wizard lets you choose from a set of [starter templates](/examples) or alternatively, you could import your own Astro project directly from GitHub.
|
||||
|
||||
```bash
|
||||
# Note: Replace "my-astro-project" with the name of your project.
|
||||
|
|
@ -52,7 +52,7 @@ You can now [Start](#start-astro) your Astro project. Once you have completed as
|
|||
|
||||
## Manual Install
|
||||
|
||||
You can also setup Astro without the aide of the `create-astro` wizard, below are the few extra steps that are required to get Astro going.
|
||||
You can also set up Astro without the aide of the `create-astro` wizard, below are the few extra steps that are required to get Astro going.
|
||||
|
||||
### Set up your project
|
||||
|
||||
|
|
@ -75,7 +75,7 @@ Astro is designed to work with the entirety of the npm package ecosystem. This i
|
|||
|
||||
### Install Astro
|
||||
|
||||
Following the instructions above, you should have a directory with a single `package.json` file inside of it. You can now setup Astro inside your project.
|
||||
Following the instructions above, you should have a directory with a single `package.json` file inside of it. You can now set up Astro inside your project.
|
||||
|
||||
```bash
|
||||
npm install astro
|
||||
|
|
|
|||
|
|
@ -160,7 +160,7 @@ const { page } = Astro.props;
|
|||
|
||||
#### The pagination `page` prop
|
||||
|
||||
Pagination will pass a `page` prop to every rendered page that represents a single page of data in the paginated collection. This includes the data that you've paginated (`page.data`) as well as metadata for the page (`page.url`, `page.start`, `page.end`, `page.total`, etc). This metadata is useful for for things like a "Next Page" button or a "Showing 1-10 of 100" message.
|
||||
Pagination will pass a `page` prop to every rendered page that represents a single page of data in the paginated collection. This includes the data that you've paginated (`page.data`) as well as metadata for the page (`page.url`, `page.start`, `page.end`, `page.total`, etc). This metadata is useful for things like a "Next Page" button or a "Showing 1-10 of 100" message.
|
||||
|
||||
| Name | Type | Description |
|
||||
| :----------------- | :-------------------: | :-------------------------------------------------------------------------------------------------------------------------------- |
|
||||
|
|
|
|||
|
|
@ -128,7 +128,7 @@ export default {
|
|||
|
||||
`check` is a function that determines whether a Component should be "claimed" by this renderer.
|
||||
|
||||
In it's simplest form, it can check for the existence of a flag on Object-based components.
|
||||
In its simplest form, it can check for the existence of a flag on Object-based components.
|
||||
|
||||
```js
|
||||
function check(Component) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue