From 310b0c7feed474f9128d46356b0377a82e80a679 Mon Sep 17 00:00:00 2001 From: bryantgillespie Date: Thu, 11 Jun 2026 16:48:42 -0400 Subject: [PATCH] Fix docs typo and casing issues --- content/cloud/2.projects/1.create.md | 4 ++-- .../community/2.contribution/2.documentation.md | 2 +- content/community/3.codebase/3.testing.md | 2 +- content/configuration/0.intro.md | 2 +- .../01.nextjs/09.live-preview-draft-mode.md | 2 +- .../01.nextjs/11.pagination-infinite-scroll.md | 14 +++++++------- content/frameworks/01.nextjs/13.visual-editor.md | 2 +- content/frameworks/02.nuxt/02.authentication.md | 2 +- content/frameworks/02.nuxt/11.reusable-blocks.md | 2 +- content/frameworks/03.astro/03.build-a-cms.md | 2 +- content/frameworks/03.astro/08.reusable-blocks.md | 2 +- .../frameworks/04.sveltekit/02.authentication.md | 4 ++-- content/frameworks/04.sveltekit/03.build-a-cms.md | 2 +- .../frameworks/04.sveltekit/04.dynamic-forms.md | 2 +- .../frameworks/04.sveltekit/05.dynamic-pages.md | 2 +- content/frameworks/04.sveltekit/06.forms.md | 2 +- .../04.sveltekit/07.internationalization.md | 2 +- content/frameworks/04.sveltekit/08.live-preview.md | 2 +- .../04.sveltekit/09.multilingual-content.md | 2 +- .../frameworks/04.sveltekit/10.reusable-blocks.md | 4 ++-- content/frameworks/07.laravel/01.data-fetching.md | 2 +- .../04.connect/7.json/2.advanced-querying.md | 2 +- content/guides/06.flows/2.data-chain.md | 2 +- .../09.extensions/2.api-extensions/1.hooks.md | 2 +- .../09.extensions/2.api-extensions/5.sandbox.md | 2 +- content/releases/2.changelog.md | 2 +- ...ealtime-chat-app-with-directus-and-sveltekit.md | 2 +- .../build-a-user-feedback-widget-with-vue-js-.md | 4 ++-- ...eo-streaming-app-with-sveltekit-and-directus.md | 2 +- ...rm-with-next-js-stripe-and-directus-automate.md | 2 +- ...-leap-week-registration-and-referral-system-.md | 2 +- ...usable-blocks-with-many-to-any-relationships.md | 2 +- ...egrate-directus-with-esp-32-hardware-sensors.md | 4 ++-- ...baby-health-tracker-with-owlet-and-ops-genie.md | 4 ++-- .../4.migration/migrate-from-notion-to-directus.md | 2 +- .../migrate-from-wordpress-to-directus.md | 2 +- ...ate-elasticsearch-indexing-with-custom-hooks.md | 2 +- .../deploy-directus-to-azure-web-apps.md | 2 +- public/oas.yaml | 2 +- 39 files changed, 51 insertions(+), 51 deletions(-) diff --git a/content/cloud/2.projects/1.create.md b/content/cloud/2.projects/1.create.md index 67ba3098..ad021160 100644 --- a/content/cloud/2.projects/1.create.md +++ b/content/cloud/2.projects/1.create.md @@ -24,11 +24,11 @@ This is the base state of your Directus project. You can select from one of the - **Empty Project** – A completely blank project, ready for you to take in the direction you need. - **Simple CRM** – A customer relationship management system (CRM) that you can customise to your needs. - **Simple eCommerce** – A ready-to-go online store you can get going with. -- **Simple CMS** – A ready-to-go content management sytem (CMS) that you can customise to your needs. +- **Simple CMS** – A ready-to-go content management system (CMS) that you can customise to your needs. ## Project Tiers -The available [project tiers](/cloud/getting-started/introduction) are billed either monthly or anually. +The available [project tiers](/cloud/getting-started/introduction) are billed either monthly or annually. The Directus Cloud enterprise tier offers power and scale to meet any project's needs and offers more datacenter regions, upgraded support options, and more. diff --git a/content/community/2.contribution/2.documentation.md b/content/community/2.contribution/2.documentation.md index 02423063..2220e493 100644 --- a/content/community/2.contribution/2.documentation.md +++ b/content/community/2.contribution/2.documentation.md @@ -32,7 +32,7 @@ After this, create a subheading called "Before You Start" and list any prerequis #### Summary -At the end of the post, add a summary that reenforces what the reader has learned and suggest next steps. +At the end of the post, add a summary that reinforces what the reader has learned and suggest next steps. ### Principles diff --git a/content/community/3.codebase/3.testing.md b/content/community/3.codebase/3.testing.md index ba545889..561bdbce 100644 --- a/content/community/3.codebase/3.testing.md +++ b/content/community/3.codebase/3.testing.md @@ -49,7 +49,7 @@ pnpm test Install [Docker](https://docs.docker.com/get-docker/) and ensure that the service is up and running. Run the following commands to start the blackbox tests: ```bash -# Ensure that you are testing against the lastest state of the codebase +# Ensure that you are testing against the latest state of the codebase pnpm --workspace-root build # Clean up in case you ran the tests before diff --git a/content/configuration/0.intro.md b/content/configuration/0.intro.md index 4e6b3571..623a5e07 100644 --- a/content/configuration/0.intro.md +++ b/content/configuration/0.intro.md @@ -222,7 +222,7 @@ Explicit casting is also available when reading from a file with the `_FILE` suf ## Environment Object Syntax -Environment vairables that end on a `*` in our docs allow you to configure internal objects with the following notation. +Environment variables that end on a `*` in our docs allow you to configure internal objects with the following notation. For the variable `MY_ENV_*`: - `MY_ENV_SIZE=1` will be turned into `{ size: 1 }` diff --git a/content/frameworks/01.nextjs/09.live-preview-draft-mode.md b/content/frameworks/01.nextjs/09.live-preview-draft-mode.md index ab9e130b..87fa6b64 100644 --- a/content/frameworks/01.nextjs/09.live-preview-draft-mode.md +++ b/content/frameworks/01.nextjs/09.live-preview-draft-mode.md @@ -9,7 +9,7 @@ technologies: authors: - name: Esther Agbaje title: Developer Advocate -description: Learn how to confgure Live Preview with Next.js' draft mode. +description: Learn how to configure Live Preview with Next.js' draft mode. navigation: title: Draft Mode Preview --- diff --git a/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md b/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md index bc518df5..26d240db 100644 --- a/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md +++ b/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md @@ -173,8 +173,8 @@ async function Pagination({ limit, currentPage }) { const totalPages = Math.ceil(totalPostCount / limit); const hasMorePage = () => { - const recievedPostsCount = limit * currentPage; - return recievedPostsCount < totalPostCount; + const receivedPostsCount = limit * currentPage; + return receivedPostsCount < totalPostCount; }; return ( @@ -264,7 +264,7 @@ With this, you can now navigate between pages from the UI: ## Implementing Infinite Scrolling -Infinite scrolling requires browser events or the Intersection observer JavaScript API to be implemented so it needs to be done on the client side but one way we can improve this is to load the initial HTML from the server. For that, we will be using [Serve Actions](https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations). +Infinite scrolling requires browser events or the Intersection observer JavaScript API to be implemented so it needs to be done on the client side but one way we can improve this is to load the initial HTML from the server. For that, we will be using [Server Actions](https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations). In the root directory, create a `components` directory, inside it, create a `PostList.js` file and add the following lines of code: @@ -379,8 +379,8 @@ const PostList = ({ initialPosts, getPosts, limit, totalPostCount }) => { const [posts, setPosts] = useState(initialPosts); const hasMorePosts = () => { - const recievedCount = limit * currentPage; - return recievedCount < totalPostCount; + const receivedCount = limit * currentPage; + return receivedCount < totalPostCount; }; return ( @@ -444,10 +444,10 @@ const handleObserver = (entries) => { } }; ``` -Here in the `useEffect` hook the Intersection Observer API is used to observe the `` element of the loading indicator. At initial mount and when the `` enters and exists the viewport, the `handleObserver()` callback function is called which will then call `fetchMorePosts()` to fetch new posts and update the state whenever there are more posts and the `` element enters the viewport. +Here in the `useEffect` hook the Intersection Observer API is used to observe the `` element of the loading indicator. At initial mount and when the `` enters and exits the viewport, the `handleObserver()` callback function is called which will then call `fetchMorePosts()` to fetch new posts and update the state whenever there are more posts and the `` element enters the viewport. With this, the infinite scrolling should now be working: -![Demonstrates the infinte scrolling functionality. When the page is scrolled down to the bottom, the loading indicator is displayed, and new posts are displayed afterwards. Finally, when the bottom of the page is reached again the text No more posts is displayed.](/img/f6dd7960-6296-4242-abc2-5a1232f06143.webp) +![Demonstrates the infinite scrolling functionality. When the page is scrolled down to the bottom, the loading indicator is displayed, and new posts are displayed afterwards. Finally, when the bottom of the page is reached again the text No more posts is displayed.](/img/f6dd7960-6296-4242-abc2-5a1232f06143.webp) ## Which To Use As with most topics, the answer is "it depends". Paginated lists tend to have better performance Search Engine Optimization (SEO) as all page content (typically smaller) is initially loaded on the page. Infinite scrolling is better at maintaining attention and exploration diff --git a/content/frameworks/01.nextjs/13.visual-editor.md b/content/frameworks/01.nextjs/13.visual-editor.md index 1915b7a4..1fb6cfe9 100644 --- a/content/frameworks/01.nextjs/13.visual-editor.md +++ b/content/frameworks/01.nextjs/13.visual-editor.md @@ -283,7 +283,7 @@ You'll notice that the `generateMetadata` function that would generate the SEO m ```js // Replace the following -export const metadat = { +export const metadata = { title: "Create Next App", description: "Generated by create next app", } diff --git a/content/frameworks/02.nuxt/02.authentication.md b/content/frameworks/02.nuxt/02.authentication.md index 3d0a65a7..413e511a 100644 --- a/content/frameworks/02.nuxt/02.authentication.md +++ b/content/frameworks/02.nuxt/02.authentication.md @@ -158,7 +158,7 @@ This will allow your Nuxt project to access directus via your Nuxt URL, eg. [htt #### Define a Directus Schema -Typescript needs to know what the structure of our Directus data will be. To achieve this create a `directus.d.ts` file in the root of our project which defines our schema: +TypeScript needs to know what the structure of our Directus data will be. To achieve this create a `directus.d.ts` file in the root of our project which defines our schema: ```ts /// diff --git a/content/frameworks/02.nuxt/11.reusable-blocks.md b/content/frameworks/02.nuxt/11.reusable-blocks.md index c84782ca..248cdb77 100644 --- a/content/frameworks/02.nuxt/11.reusable-blocks.md +++ b/content/frameworks/02.nuxt/11.reusable-blocks.md @@ -106,7 +106,7 @@ This will allow your Nuxt project to access directus via your Nuxt URL, eg. [htt #### Define a Directus Schema -Typescript needs to know what the structure of our Directus data will be. To achieve this create a `directus.d.ts` file in the root of our project which defines our schema: +TypeScript needs to know what the structure of our Directus data will be. To achieve this create a `directus.d.ts` file in the root of our project which defines our schema: ```ts /// diff --git a/content/frameworks/03.astro/03.build-a-cms.md b/content/frameworks/03.astro/03.build-a-cms.md index 807ca215..2dca3644 100644 --- a/content/frameworks/03.astro/03.build-a-cms.md +++ b/content/frameworks/03.astro/03.build-a-cms.md @@ -1118,7 +1118,7 @@ const { title, description } = seo || { title: "Default Title", description: "De The code above will set the title and description for each page based on the data coming from the CMS. If the SEO data is not available, it will use the default title and description. -The CMS also has a navigation collection that has a header and footer data. You can use the `header` and `footer` fields to set the header and footer in the `Layout` component so it is reuseable for all pages. +The CMS also has a navigation collection that has a header and footer data. You can use the `header` and `footer` fields to set the header and footer in the `Layout` component so it is reusable for all pages. To do this, you first need the header and footer data from the CMS. diff --git a/content/frameworks/03.astro/08.reusable-blocks.md b/content/frameworks/03.astro/08.reusable-blocks.md index c4072335..52734191 100644 --- a/content/frameworks/03.astro/08.reusable-blocks.md +++ b/content/frameworks/03.astro/08.reusable-blocks.md @@ -20,7 +20,7 @@ navigation: You will need: - A Directus project with the collections defined in our Create Reusable Blocks with Many-to-Any Relationships tutorial. -- Your public policy should have read permission on the reuseable blocks collections. +- Your public policy should have read permission on the reusable blocks collections. - Fundamental understanding of Astro concepts. ## Edit Public Policy diff --git a/content/frameworks/04.sveltekit/02.authentication.md b/content/frameworks/04.sveltekit/02.authentication.md index 059486d6..2d7a7e73 100644 --- a/content/frameworks/04.sveltekit/02.authentication.md +++ b/content/frameworks/04.sveltekit/02.authentication.md @@ -87,7 +87,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created @@ -282,7 +282,7 @@ In the following step, you will create a login component where the users will be ``` -### Json Authentcation mode +### Json Authentication mode Json Authentication mode is one of the two approaches Directus offers to authentication. It involves the server returning an access token and a refresh token in the response body during authentication. To use the json mode, update your authentication composable in your `./src/lib/directus.js` file to this: ```javascript diff --git a/content/frameworks/04.sveltekit/03.build-a-cms.md b/content/frameworks/04.sveltekit/03.build-a-cms.md index c3f9614a..a5c82c08 100644 --- a/content/frameworks/04.sveltekit/03.build-a-cms.md +++ b/content/frameworks/04.sveltekit/03.build-a-cms.md @@ -70,7 +70,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/04.dynamic-forms.md b/content/frameworks/04.sveltekit/04.dynamic-forms.md index eca0d104..f70de040 100644 --- a/content/frameworks/04.sveltekit/04.dynamic-forms.md +++ b/content/frameworks/04.sveltekit/04.dynamic-forms.md @@ -86,7 +86,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/05.dynamic-pages.md b/content/frameworks/04.sveltekit/05.dynamic-pages.md index d4a7d6b6..bb63d7ad 100644 --- a/content/frameworks/04.sveltekit/05.dynamic-pages.md +++ b/content/frameworks/04.sveltekit/05.dynamic-pages.md @@ -63,7 +63,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/06.forms.md b/content/frameworks/04.sveltekit/06.forms.md index fdff8b76..f546525d 100644 --- a/content/frameworks/04.sveltekit/06.forms.md +++ b/content/frameworks/04.sveltekit/06.forms.md @@ -76,7 +76,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/07.internationalization.md b/content/frameworks/04.sveltekit/07.internationalization.md index 7dbd790c..4b363115 100644 --- a/content/frameworks/04.sveltekit/07.internationalization.md +++ b/content/frameworks/04.sveltekit/07.internationalization.md @@ -189,7 +189,7 @@ export async function load({ fetch, params, url }) { The above code will: -- Use the `readItem` funtion to find and get the news that matches the primary key field (slug) in the news collection. +- Use the `readItem` function to find and get the news that matches the primary key field (slug) in the news collection. - Fetch all the available languages from the `languages` collection. Create a `+page.svelte` file in the `routes/news` directory and add the code: diff --git a/content/frameworks/04.sveltekit/08.live-preview.md b/content/frameworks/04.sveltekit/08.live-preview.md index 5697bc6e..3270d868 100644 --- a/content/frameworks/04.sveltekit/08.live-preview.md +++ b/content/frameworks/04.sveltekit/08.live-preview.md @@ -72,7 +72,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/09.multilingual-content.md b/content/frameworks/04.sveltekit/09.multilingual-content.md index 109eea39..16da6c12 100644 --- a/content/frameworks/04.sveltekit/09.multilingual-content.md +++ b/content/frameworks/04.sveltekit/09.multilingual-content.md @@ -64,7 +64,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/frameworks/04.sveltekit/10.reusable-blocks.md b/content/frameworks/04.sveltekit/10.reusable-blocks.md index 8f50391f..969fe67d 100644 --- a/content/frameworks/04.sveltekit/10.reusable-blocks.md +++ b/content/frameworks/04.sveltekit/10.reusable-blocks.md @@ -54,7 +54,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type-checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created @@ -206,7 +206,7 @@ Create a `src/lib/components/CardGroup.svelte` file. Add the following code: ``` ### Page Component -Create a `fetchPage.js` file inside the `./src/lib` directory to use the Directus client to fetch pages. Add the foloowing code: +Create a `fetchPage.js` file inside the `./src/lib` directory to use the Directus client to fetch pages. Add the following code: ```javascript // src/lib/fetchPage.js diff --git a/content/frameworks/07.laravel/01.data-fetching.md b/content/frameworks/07.laravel/01.data-fetching.md index 6d396ad0..c1cabc00 100644 --- a/content/frameworks/07.laravel/01.data-fetching.md +++ b/content/frameworks/07.laravel/01.data-fetching.md @@ -332,7 +332,7 @@ Navigate to `http://127.0.0.1:8000/blog` to access the blogs page. ## Add Navigation -Run the commmand below to create a new service provider: +Run the command below to create a new service provider: ```shell php artisan make:provider ViewServiceProvider diff --git a/content/guides/04.connect/7.json/2.advanced-querying.md b/content/guides/04.connect/7.json/2.advanced-querying.md index cec3ffda..f3c92e13 100644 --- a/content/guides/04.connect/7.json/2.advanced-querying.md +++ b/content/guides/04.connect/7.json/2.advanced-querying.md @@ -79,7 +79,7 @@ In GraphQL, each `json` type field exposes a `json(path: String!)` sub-field wit :: ::callout{icon="i-lucide-info" color="info"} -The SDK supports a type safe `json(field, path)` expression within its `fields` array, see [SDK Type Safety](#sdk-type-safety) for more deatils. +The SDK supports a type safe `json(field, path)` expression within its `fields` array, see [SDK Type Safety](#sdk-type-safety) for more details. :: ### Response Format diff --git a/content/guides/06.flows/2.data-chain.md b/content/guides/06.flows/2.data-chain.md index 65ad58be..668aac98 100644 --- a/content/guides/06.flows/2.data-chain.md +++ b/content/guides/06.flows/2.data-chain.md @@ -36,7 +36,7 @@ The keys contain the following information. - **`$env`** — Environment variables allowed in `FLOWS_ENV_ALLOW_LIST`. This could include PUBLIC_URL, PORT, etc. Every data chain has an `$env` key. - **`$last`** — The value appended under $last changes after each operation. It stores data of the last operation that executed in the Flow. Every data chain has a `$last` key. -Operation keys will contain the data (if any) generated by the first operation. If none, `null` will be appeneded. It will also be common to have nested JSON data. +Operation keys will contain the data (if any) generated by the first operation. If none, `null` will be appended. It will also be common to have nested JSON data. Real-life examples of data chains and their data structures will vary, based on your Flow's unique configuration. diff --git a/content/guides/09.extensions/2.api-extensions/1.hooks.md b/content/guides/09.extensions/2.api-extensions/1.hooks.md index da92146e..cd95177e 100644 --- a/content/guides/09.extensions/2.api-extensions/1.hooks.md +++ b/content/guides/09.extensions/2.api-extensions/1.hooks.md @@ -263,7 +263,7 @@ The embed register function requires two parameters - the position of the embed ## Sandboxed Hooks -When using the sandbox, you have access to `filter` and `action` events only. Callback functions recieve the `payload` object as the only parameter. +When using the sandbox, you have access to `filter` and `action` events only. Callback functions receive the `payload` object as the only parameter. ### TypeScript diff --git a/content/guides/09.extensions/2.api-extensions/5.sandbox.md b/content/guides/09.extensions/2.api-extensions/5.sandbox.md index 26cc17d3..9d4a3d4e 100644 --- a/content/guides/09.extensions/2.api-extensions/5.sandbox.md +++ b/content/guides/09.extensions/2.api-extensions/5.sandbox.md @@ -7,7 +7,7 @@ description: Sandboxed Extensions run in an isolated environment and must reques Sandboxed API Extensions run in an isolated environment and must request permission scopes to interact with the host environment. -The sandboxed environment only has access to [JavaScript standard built-in objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects) which means that common runtime functions such as `console` and `setTimeout` are not available. A sandboxed extension is given additional capabilites through scopes and functions provided by the `directus:api` module. +The sandboxed environment only has access to [JavaScript standard built-in objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects) which means that common runtime functions such as `console` and `setTimeout` are not available. A sandboxed extension is given additional capabilities through scopes and functions provided by the `directus:api` module. ## Enabling the Sandbox diff --git a/content/releases/2.changelog.md b/content/releases/2.changelog.md index 66854280..83c5dda8 100644 --- a/content/releases/2.changelog.md +++ b/content/releases/2.changelog.md @@ -146,7 +146,7 @@ This month we had two releases. - The [Tree Map Chart](https://github.com/directus-labs/extensions/tree/main/packages/treemap-chart-panel) presents a cluster or boxes where the size of each box represent the value. You can also group data into categories which are presented in different colors. - The [Funnel Chart](https://github.com/directus-labs/extensions/tree/main/packages/funnel-chart-panel) presents a list of numbers in an ascending or descending funnel chart. - The [Scatter Plot Chart](https://github.com/directus-labs/extensions/tree/main/packages/scatter-plot-panel) is a 2-axis chart where values are plotted as dots. You can optionally add axis labels and hover over any of the dots to see the values. -- The [Timeline Chart](https://github.com/directus-labs/extensions/tree/main/packages/timeline-chart-panel) presents a series of tasks or events with a start and end date on a graph. You can also group data into categories on the y axis and seperate tasks into different colors. +- The [Timeline Chart](https://github.com/directus-labs/extensions/tree/main/packages/timeline-chart-panel) presents a series of tasks or events with a start and end date on a graph. You can also group data into categories on the y axis and separate tasks into different colors. - The [Customizable Tabular Layout Boilerplate](https://github.com/directus-labs/extensions/tree/main/boilerplates/tabular-layout) give extension authors the ability to use it as a base for their customizations. ## October 2024 diff --git a/content/tutorials/2.projects/build-a-realtime-chat-app-with-directus-and-sveltekit.md b/content/tutorials/2.projects/build-a-realtime-chat-app-with-directus-and-sveltekit.md index b3cae580..3aef2cc8 100644 --- a/content/tutorials/2.projects/build-a-realtime-chat-app-with-directus-and-sveltekit.md +++ b/content/tutorials/2.projects/build-a-realtime-chat-app-with-directus-and-sveltekit.md @@ -67,7 +67,7 @@ When prompted, select SvelteKit minimal as the template. Do not add type checkin ◇ Which template would you like? │ SvelteKit minimal │ -◇ Add type checking with Typescript? +◇ Add type checking with TypeScript? │ No │ ◆ Project created diff --git a/content/tutorials/2.projects/build-a-user-feedback-widget-with-vue-js-.md b/content/tutorials/2.projects/build-a-user-feedback-widget-with-vue-js-.md index a2fd7a39..4fdc9d5e 100644 --- a/content/tutorials/2.projects/build-a-user-feedback-widget-with-vue-js-.md +++ b/content/tutorials/2.projects/build-a-user-feedback-widget-with-vue-js-.md @@ -28,7 +28,7 @@ Before we hop 🐰 in , here’s what you’ll need to follow along: **Knowledge** -- Beginner knowledge of Javascript, Typescript, and Vue.js (Composition API) +- Beginner knowledge of Javascript, TypeScript, and Vue.js (Composition API) **Tooling** @@ -388,7 +388,7 @@ async function handleSubmission(rating?: number) { const data = await response.json(); feedback.id = data.id; - // If the reponse has comments, we can assume they've completed the second step. So we'll show the success message. + // If the response has comments, we can assume they've completed the second step. So we'll show the success message. if (data.comments) { success.value = true; } diff --git a/content/tutorials/2.projects/build-a-video-streaming-app-with-sveltekit-and-directus.md b/content/tutorials/2.projects/build-a-video-streaming-app-with-sveltekit-and-directus.md index dac11da8..ab7e4c2e 100644 --- a/content/tutorials/2.projects/build-a-video-streaming-app-with-sveltekit-and-directus.md +++ b/content/tutorials/2.projects/build-a-video-streaming-app-with-sveltekit-and-directus.md @@ -276,7 +276,7 @@ Now click on any of the videos to stream it. ## Creating Search Functionality -In your `services/index.ts`, add a new funtion that implements search functionality to find videos by title or description. +In your `services/index.ts`, add a new function that implements search functionality to find videos by title or description. ```ts export async function searchVideos(query: string): Promise { diff --git a/content/tutorials/2.projects/build-an-ecommerce-platform-with-next-js-stripe-and-directus-automate.md b/content/tutorials/2.projects/build-an-ecommerce-platform-with-next-js-stripe-and-directus-automate.md index e1f1872d..aa326ee9 100644 --- a/content/tutorials/2.projects/build-an-ecommerce-platform-with-next-js-stripe-and-directus-automate.md +++ b/content/tutorials/2.projects/build-an-ecommerce-platform-with-next-js-stripe-and-directus-automate.md @@ -329,7 +329,7 @@ export function CartProvider({ children }: CartProviderProps) { Let's break down the `cart-context` component for better understanding: - `CartContext` uses React's `createContext` API to create a new context and `useState` for storing items into the `cartItem` array. -- Use `localStorage` for storing `cartItems` for persistance +- Use `localStorage` for storing `cartItems` for persistence - Creates a `CartProvider` component from which the context can be passed from to other components - `addToCart` adds an item to the shopping cart if it's not already there. - `removeFromCart` removes an item from the shopping cart. diff --git a/content/tutorials/2.projects/build-the-leap-week-registration-and-referral-system-.md b/content/tutorials/2.projects/build-the-leap-week-registration-and-referral-system-.md index 4eabe643..c071c080 100644 --- a/content/tutorials/2.projects/build-the-leap-week-registration-and-referral-system-.md +++ b/content/tutorials/2.projects/build-the-leap-week-registration-and-referral-system-.md @@ -108,7 +108,7 @@ export default defineEventHandler(async (event) => { throw createError({ statusCode: 500, statusMessage: 'Ticket not found' }); } - // If they have genearated 3 avatars, throw an error + // If they have generated 3 avatars, throw an error if (ticket.avatars && ticket.avatars.length >= avatarLimit) { throw createError({ statusCode: 500, statusMessage: `Maximum number of ${avatarLimit} avatars generated.` }); } diff --git a/content/tutorials/2.projects/create-reusable-blocks-with-many-to-any-relationships.md b/content/tutorials/2.projects/create-reusable-blocks-with-many-to-any-relationships.md index a08b8e9a..25a72304 100644 --- a/content/tutorials/2.projects/create-reusable-blocks-with-many-to-any-relationships.md +++ b/content/tutorials/2.projects/create-reusable-blocks-with-many-to-any-relationships.md @@ -351,7 +351,7 @@ Directus returns for Many To Any (M2A) relationships. If you notice you aren't receiving the data that you expect, check the Permissions settings for your Public or chosen role. You'll have to enable Read access for each collection using in the Pages > Blocks Many-To-Any field. -### Use Typescript +### Use TypeScript We recommend adding types for each of your different collections to your frontend framework. diff --git a/content/tutorials/2.projects/integrate-directus-with-esp-32-hardware-sensors.md b/content/tutorials/2.projects/integrate-directus-with-esp-32-hardware-sensors.md index c0d0cb9f..e4361983 100644 --- a/content/tutorials/2.projects/integrate-directus-with-esp-32-hardware-sensors.md +++ b/content/tutorials/2.projects/integrate-directus-with-esp-32-hardware-sensors.md @@ -65,7 +65,7 @@ If you are using the ESP32 Wroom 32D, choose the ESP 32 DA Module and the COM po ## Logging temperature and humidity data to Serial -You can log the values from the DHT22 to the serial monitor by defining variables for the temperature and humidity and then initializing the DHT object. Within the setup function, you must initialize the Serial logging and intialize the connection to the DHT22 module. +You can log the values from the DHT22 to the serial monitor by defining variables for the temperature and humidity and then initializing the DHT object. Within the setup function, you must initialize the Serial logging and initialize the connection to the DHT22 module. Within the loop function, the sensor readings are obtained from the DHT22 and stored to the temperature and humidity variables. With all that done, these values can be logged to the serial monitor. @@ -97,7 +97,7 @@ void loop() { ``` ## Sending the temperature and humidity data to Directus At this point, you have your ESP32 logging data to the Serial monitor. To send these to Directus, you have to introduce the HTTP and WiFi libraries to your project. -The WiFi library connects your ESP32 to the internet while the HTTP library turns your ESP32 into an HTTP agent that can make HTTP requests. The script below is the complete code for logging data to Directus - add it to the defaul file on your opened Arduino IDE: +The WiFi library connects your ESP32 to the internet while the HTTP library turns your ESP32 into an HTTP agent that can make HTTP requests. The script below is the complete code for logging data to Directus - add it to the default file on your opened Arduino IDE: ```cpp #include #include diff --git a/content/tutorials/2.projects/use-directus-as-a-baby-health-tracker-with-owlet-and-ops-genie.md b/content/tutorials/2.projects/use-directus-as-a-baby-health-tracker-with-owlet-and-ops-genie.md index d37b7ee1..c3f91b20 100644 --- a/content/tutorials/2.projects/use-directus-as-a-baby-health-tracker-with-owlet-and-ops-genie.md +++ b/content/tutorials/2.projects/use-directus-as-a-baby-health-tracker-with-owlet-and-ops-genie.md @@ -6,7 +6,7 @@ title: Use Directus as a Baby Health Tracker with Owlet and OpsGenie authors: - name: Andreas Morgner title: Guest Author -description: Learn how to integrate Directus with hardware sensors and incident repsonse systems. +description: Learn how to integrate Directus with hardware sensors and incident response systems. --- I have a baby and like many parents rely on monitors and sensors to make sure they're ok. In this article, we will explore Directus as a backend for a smart wearable device, and how to extend the functionality of the the apps shipped with the device. I personally use the [Owlet Smart Sock](https://owletcare.com/products/owlet-smart-sock), but the approaches covered in this article can be adapted for many other sensors. @@ -33,7 +33,7 @@ For each element of the data provided by the sensor, we want to save these value ### OpsGenie Alerts Collection -This collection is for integration into the OpsGenie alerting system. As Direcuts provides the fields for sort, creation, and update date as well aw who perfomred the action, we enanled these fields during creation. Next to the id we need the following fields for alerts we want to create later on. Next to the default fields, the most important custom fields are the following ones: +This collection is for integration into the OpsGenie alerting system. As Direcuts provides the fields for sort, creation, and update date as well aw who performed the action, we enanled these fields during creation. Next to the id we need the following fields for alerts we want to create later on. Next to the default fields, the most important custom fields are the following ones: Create an `opsgenie_alert` collection for integration into the OpsGenie alerting system. As Directus provides the fields for sort, creation, and update date as well as who performed an action, enable these fields during creation. Create the following fields: diff --git a/content/tutorials/4.migration/migrate-from-notion-to-directus.md b/content/tutorials/4.migration/migrate-from-notion-to-directus.md index 4eff964a..1535a1df 100644 --- a/content/tutorials/4.migration/migrate-from-notion-to-directus.md +++ b/content/tutorials/4.migration/migrate-from-notion-to-directus.md @@ -94,7 +94,7 @@ Well, Directus is not just another CMS. It offers a unique combination of flexib ## Creating the Blogs Collection and Data Model -Migrating my blog content to Directus was a smooth process. In my Directus instance, I initally created a `blogs` collection to hold all blog data. Then I went on to design the data model with the following fields: +Migrating my blog content to Directus was a smooth process. In my Directus instance, I initially created a `blogs` collection to hold all blog data. Then I went on to design the data model with the following fields: - `id` - Integer Input - `status` - Dropdown diff --git a/content/tutorials/4.migration/migrate-from-wordpress-to-directus.md b/content/tutorials/4.migration/migrate-from-wordpress-to-directus.md index 1f21c8e0..9504caa8 100644 --- a/content/tutorials/4.migration/migrate-from-wordpress-to-directus.md +++ b/content/tutorials/4.migration/migrate-from-wordpress-to-directus.md @@ -88,7 +88,7 @@ After the JSON file is extracted and the schema is developed on Directus, you ca ![Import in Directus Collection](/img/ec2f9808-5775-45a1-bac8-715095434502.webp) -If you have images in the post or pages, you won’t be able to access them. With the Directus REST API we will be able to manipulate the JSON to extact the images and save to Directus Files so we can access the files in the post. +If you have images in the post or pages, you won’t be able to access them. With the Directus REST API we will be able to manipulate the JSON to extract the images and save to Directus Files so we can access the files in the post. To use the API we need to get the API token at User Directory → Administrator → Admin User → Token. Copy the token and Keep it somewhere, we will use it later. diff --git a/content/tutorials/5.extensions/integrate-elasticsearch-indexing-with-custom-hooks.md b/content/tutorials/5.extensions/integrate-elasticsearch-indexing-with-custom-hooks.md index 5b7adcf6..4b5ec9ad 100644 --- a/content/tutorials/5.extensions/integrate-elasticsearch-indexing-with-custom-hooks.md +++ b/content/tutorials/5.extensions/integrate-elasticsearch-indexing-with-custom-hooks.md @@ -24,7 +24,7 @@ In your `docker-compose.yml` file, set an `EXTENSIONS_AUTO_RELOAD` environment v In your terminal, navigate to your `extensions` directory and run `npx create-directus-extension@latest`. Name your extension `elasticsearch-indexing` and choose a `hook` type and create the extension with `JavaScript`. Allow Directus to automatically install dependencies and wait for them to install. -## Seting Up Elasticsearch +## Setting Up Elasticsearch To integrate Directus and Elasticsearch, you will need a running instance of both. For this tutorial, [Elastic Cloud](https://www.elastic.co/cloud/elasticsearch-service/signup) will be used. You will need both the Cloud ID and an API Key, which you can generate from your deployment dashboard. diff --git a/content/tutorials/6.self-hosting/deploy-directus-to-azure-web-apps.md b/content/tutorials/6.self-hosting/deploy-directus-to-azure-web-apps.md index ae4f6fcb..0f40e6c4 100644 --- a/content/tutorials/6.self-hosting/deploy-directus-to-azure-web-apps.md +++ b/content/tutorials/6.self-hosting/deploy-directus-to-azure-web-apps.md @@ -29,7 +29,7 @@ Sign into your Azure account via the [Azure Portal](https://portal.azure.com/). Provide a unique name for your resource group and choose the Azure subscription to link your new group to. Select the appropriate region for your resource group, considering factors like data residency and proximity to users, and adjust other settings if required. -## Setting Up Azure Database for PostgresSQL +## Setting Up Azure Database for PostgreSQL Directus connects to an existing database, so it's time to create one. Enter your new resource group and, in the Overview pane, click the **Create** button to initiate the resource creation process. diff --git a/public/oas.yaml b/public/oas.yaml index e4935de6..aa003533 100644 --- a/public/oas.yaml +++ b/public/oas.yaml @@ -274,7 +274,7 @@ paths: description: The user's one-time-password (if MFA is enabled). responses: '200': - description: Successful authentification + description: Successful authentication content: application/json: schema: