Skip to content

Commit

Permalink
Broken links (tinacms#2743)
Browse files Browse the repository at this point in the history
* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* addding icon to title

* double spaced pipe with a llama

* fixing broken links with AI

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* removing playgrounds

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* TinaCMS content update

Co-authored-by: Isaac Lombard <[email protected]>

* updating more broken links

* outlook safelink lol

---------

Co-authored-by: tina-cloud-app[bot] <58178390+tina-cloud-app[bot]@users.noreply.github.com>
  • Loading branch information
isaaclombardssw and tina-cloud-app[bot] authored Jan 15, 2025
1 parent c0ee144 commit 2a324b1
Show file tree
Hide file tree
Showing 28 changed files with 394 additions and 391 deletions.
6 changes: 2 additions & 4 deletions content/blog/Introducing-TinaGPT-Chatbot-.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,13 @@ More info: [ssw.com.au/rules/website-chatbot](https://www.ssw.com.au/rules/webs

Meet TinaGPT, our helpful little friend, ready to assist you. It has access all the Tina documentation.

Check it out now - open the orange chat bubble 🟠 on [tina.io](https://aus01.safelinks.protection.outlook.com) 🦙
Check it out now - open the orange chat bubble 🟠.

![](/img/blog/Introducing-TinaGPT-Chatbot/tinaGPT-img_afz4sq.jpg)\*\* Figure: Ask TinaGPT your questions for amazing immediate support 🦙\*\*

But don't worry, if you prefer to talk to the team we're still here!

You can [book a demo with an expert](https://aus01.safelinks.protection.outlook.com), join the [discussion on Discord](https://aus01.safelinks.protection.outlook.com), or email us if you have any questions.


You can book a demo with an expert, join the Discord discussion, or email us if you have any questions.

Cheers,

Expand Down
4 changes: 3 additions & 1 deletion content/blog/Tina-CMS--Leveljs.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ In 2010 Mozilla took a position against the [Web SQL Database](https://www.w3.or
Mozilla instead championed the simpler [Indexed Database API](https://en.wikipedia.org/wiki/Indexed_Database_API) standard (IndexedDB). This standard has a simpler and more stable API for developers to rely upon than Web SQL. It exposes a Javascript API over a NoSQL database. It also provides more storage over the existing [Web storage](https://en.wikipedia.org/wiki/Web_storage) standard.

Subsequently in 2011, to little fanfare, prolific Google engineers [Jeffrey Dean](https://research.google/people/jeff/) and [Sanjay Ghemawat](https://research.google/people/SanjayGhemawat) released the [LevelDB](https://github.com/google/leveldb) library. This open source project was a reimplementation of a subset of Google’s [BigTable](https://en.wikipedia.org/wiki/Bigtable), in particular the Sorted String Table (SSTable) and [log-structured merge-tree](https://en.wikipedia.org/wiki/Log-structured_merge-tree) (LSM tree) concepts. Dean & Ghemawat contributed the newly released library to the Chromium project and since then it has been used for the Chrome web browser’s IndexedDB implementation \[2]\[3].
Subsequently in 2011, to little fanfare, prolific Google engineers released the [LevelDB](https://github.com/google/leveldb) library. This open source project was a reimplementation of a subset of Google’s [BigTable](https://en.wikipedia.org/wiki/Bigtable), in particular the Sorted String Table (SSTable) and [log-structured merge-tree](https://en.wikipedia.org/wiki/Log-structured_merge-tree) (LSM tree) concepts. Dean & Ghemawat contributed the newly released library to the Chromium project and since then it has been used for the Chrome web browser’s IndexedDB implementation \[2]\[3].

## What Makes LevelDB Stand Out?

Expand Down Expand Up @@ -87,3 +87,5 @@ LevelDB emerged from the necessity for an embedded database capable of supportin
2. \[2] See [chrome://credits/]()
3. \[3] Somewhat ironically, Mozilla Firefox is still using SQLite for its implementation of IndexedDB.
4. \[4] In older versions of Level.js, this feature was provided by a [module](https://github.com/dominictarr/level-sublevel), but has since been incorporated into the core library.

LevelDB was created by [Sanjay Ghemawat](https://research.google/people/sanjayghemawat/?\&type=google) and [Jeff Dean](https://research.google/people/jeff/) at Google.
32 changes: 15 additions & 17 deletions content/blog/add-and-delete-files.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@ next: content/blog/jamstack-denver-talk.mdx

When you install Tina, you immediately get access to a **sidebar**. This sidebar is the main interface for editing and managing content with Tina

To make content editable on your site, you need to register a [form](https://tinacms.org/docs/plugins/forms) to Tina. Forms appear in the sidebar, displaying [fields](https://tinacms.org/docs/plugins/fields) where you can edit content on the page.
To make content editable on your site, you need to register a form to Tina. Forms appear in the sidebar, displaying [fields](https://tinacms.org/docs/plugins/fields) where you can edit content on the page.

[Plugins](https://tinacms.org/docs/cms#plugins) extend the functionality of the core CMS. Behind the scenes, plugins do some big work with Tina. They register forms, create new screen views, and allow us to add new content. If you're interested to learn more, read this post on Tina's [dynamic plugin system](https://tinacms.org/blog/dynamic-plugin-system/).
Plugins extend the functionality of the core CMS. Behind the scenes, plugins do some big work with Tina. They register forms, create new screen views, and allow us to add new content. If you're interested to learn more, read this post on Tina's [dynamic plugin system](https://tinacms.org/blog/dynamic-plugin-system/).

## Creating New Files

Expand Down Expand Up @@ -79,7 +79,7 @@ The example below shows how to create an instance of a `RemarkCreatorPlugin`. Th
** 1. import RemarkCreatorPlugin to
** construct a `content-creator` plugin.
*/
import { RemarkCreatorPlugin } from 'gatsby-tinacms-remark'
import { RemarkCreatorPlugin } from 'gatsby-tinacms-remark';

/*
** 2. instantiate RemarkCreatorPlugin with
Expand All @@ -96,8 +96,8 @@ const CreatePostPlugin = new RemarkCreatorPlugin({
** FILENAME: A function whose return value
** should be the path to the new file.
*/
filename: form => {
return form.filename
filename: (form) => {
return form.filename;
},

/*
Expand All @@ -114,7 +114,7 @@ const CreatePostPlugin = new RemarkCreatorPlugin({
'The full path to the new markdown file, relative to the repository root.',
},
],
})
});
```

### Formatting the path to the new file
Expand All @@ -124,13 +124,13 @@ There are many ways you could set up the return value for the `filename`. A help
```javascript
const CreatePostPlugin = new RemarkCreatorPlugin({
//...
filename: form => {
filename: (form) => {
// 'form' holds the data inputted by the 'create-form'
const slug = form.title.replace(/\s+/, '-').toLowerCase()
const slug = form.title.replace(/\s+/, '-').toLowerCase();

return `content/blog/${slug}.md`
return `content/blog/${slug}.md`;
},
})
});
```

Notice how data submitted by the `create-form` is being used. When a new file is created, you can have the editor enter a title, and then all the **`create-form` data is passed to the `filename` function**.
Expand Down Expand Up @@ -230,8 +230,6 @@ const CreatePostPlugin = new RemarkCreatorPlugin({

Notice the use of a `required` property on the `title` field. Use this to ensure you get all the required data necessary for creating the new file.

Learn about the default [fields](https://tinacms.org/docs/plugins/fields).

## 4. Configure Defaults

`RemarkCreatorPlugin` can take additional information to populate default data into newly created files. For markdown, we can add default frontmatter values and a markdown body — see the example below.
Expand Down Expand Up @@ -296,15 +294,15 @@ Below is an example blog template with the `delete-action` added:

```javascript
// 1. Import `DeleteAction`
import { remarkForm, DeleteAction } from 'gatsby-tinacms-remark'
import { remarkForm, DeleteAction } from 'gatsby-tinacms-remark';

function BlogTemplate(props) {
return (
<>
<h1>{props.markdownRemark.frontmatter.title}</h1>
<p>{props.markdownRemark.frontmatter.description}</p>
</>
)
);
}

// 2. Add the `DeleteAction` to the form
Expand All @@ -324,9 +322,9 @@ let BlogFormOptions = {
component: 'textarea',
},
],
}
};

export default remarkForm(BlogTemplate, BlogForm)
export default remarkForm(BlogTemplate, BlogForm);
```

You can import the `DeleteAction` from `gatsby-tinacms-remark` or `gatsby-tinacms-json`, depending on your filetype. Then on your form options definition, add the action and that’s it!
Expand All @@ -337,4 +335,4 @@ You can now access this `delete-action` via the three-dot icon near the save but

Hopefully this tutorial gave you some insight into setting up two core bits of CMS functionality with Tina + Gatsby.

If you run into trouble or have any questions, head over to the [Tina Forum](https://community.tinacms.org/) for help. Stoked on TinaCMS? Please ⭐️ us on [GitHub](https://github.com/tinacms/tinacms) or [Tweet us](https://twitter.com/Tina_cms) 🐦 to show-off your Tina projects.
Stoked on TinaCMS? Please ⭐️ us on [GitHub](https://github.com/tinacms/tinacms) or [Tweet us](https://twitter.com/Tina_cms) 🐦 to show-off your Tina projects.
60 changes: 23 additions & 37 deletions content/blog/announcing-extending-tina.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -15,20 +15,6 @@ prev: content/blog/automating-pull-requests.mdx
The latest update empowers developers to put `validation` ,`component` and `parse` functions directly into the schema.

## Quick Demo

### Validation

Below, if you click the "pencil" icon and edit the "Title" field, the validation function runs and gives an error to the user when it is more than 20 characters.

<Iframe height={500} iframeSrc="https://tina-gql-playground.vercel.app/?markdownCode=---%0Atitle%3A+Hello%2C+World%0A---&schemaCode=import+%7B+defineSchema+%7D+from+%27tinacms%27%0A%0Aexport+default+defineSchema%28%7B%0A++collections%3A+%5B%7B%0A++++label%3A+%22Post%22%2C%0A++++name%3A+%22post%22%2C%0A++++path%3A+%22posts%22%2C%0A++++fields%3A+%5B%7B%0A++++++label%3A+%22Title%22%2C%0A++++++name%3A+%22title%22%2C%0A++++++type%3A+%22string%22%2C%0A++++++ui%3A+%7B%0A++++++++validate%3A+%28val%29+%3D%3E+%7B%0A++++++++++if+%28val.length+%3E+20%29+%7B%0A++++++++++++return+%27The+title+can+not+be+more+the+20+characters%27%0A++++++++++%7D%0A++++++++%7D%0A++++++%7D%0A++++%7D%5D%0A++%7D%5D%0A%7D%29&reactCode=import+*+as+React+from+%27react%27%0Aimport+%7B+useTina+%7D+from+%27tinacms%2Fdist%2Fedit-state%27%0A%0Aexport+default+function+Page%28props%29+%7B%0A++const+%7Bdata%2C+isLoading%7D+%3D+useTina%28%7B+query%3A+%60query+%7B%0A++post%28relativePath%3A+%22hello-world.md%22%29+%7B%0A++++title%0A++%7D%0A%7D%60%2C%0A++++variables%3A+%7B%7D%2C%0A++++data%3A+props.data%0A++%7D%29%0A%0A++if%28isLoading%29+%7B%0A++++return+%3Cdiv%3ELoading...%3C%2Fdiv%3E%0A++%7D%0A%0A++return+%28%0A++++%3Cdiv+className%3D%22bg-white%22%3E%0A++++++%3Cdiv+className%3D%22max-w-7xl+mx-auto+text-center+py-12+px-4+sm%3Apx-6+lg%3Apy-16+lg%3Apx-8%22%3E%0A++++++++%3Ch2+className%3D%22text-3xl+font-extrabold+tracking-tight+text-gray-900+sm%3Atext-4xl%22%3E%0A++++++++++%3Cspan+className%3D%22block%22%3E%7Bdata.post.title%7D%3C%2Fspan%3E%0A++++++++++%3Cspan+className%3D%22block%22%3EStart+your+free+trial+today.%3C%2Fspan%3E%0A++++++++%3C%2Fh2%3E%0A++++++++%3Cdiv+className%3D%22mt-8+flex+justify-center%22%3E%0A++++++++++%3Cdiv+className%3D%22inline-flex+rounded-md+shadow%22%3E%0A++++++++++++%3Ca%0A++++++++++++++href%3D%22%23%22%0A++++++++++++++className%3D%22inline-flex+items-center+justify-center+px-5+py-3+border+border-transparent+text-base+font-medium+rounded-md+text-white+bg-indigo-600+hover%3Abg-indigo-700%22%0A++++++++++++%3E%0A++++++++++++++Get+started%0A++++++++++++%3C%2Fa%3E%0A++++++++++%3C%2Fdiv%3E%0A++++++++++%3Cdiv+className%3D%22ml-3+inline-flex%22%3E%0A++++++++++++%3Ca%0A++++++++++++++href%3D%22%23%22%0A++++++++++++++className%3D%22inline-flex+items-center+justify-center+px-5+py-3+border+border-transparent+text-base+font-medium+rounded-md+text-indigo-700+bg-indigo-100+hover%3Abg-indigo-200%22%0A++++++++++++%3E%0A++++++++++++++Learn+more%0A++++++++++++%3C%2Fa%3E%0A++++++++++%3C%2Fdiv%3E%0A++++++++%3C%2Fdiv%3E%0A++++++%3C%2Fdiv%3E%0A++++%3C%2Fdiv%3E%0A++%29%0A%7D" />

### Custom components

With this update, you can create your custom components easily; see the example below for using a custom component.

<Iframe height={500} iframeSrc="https://tina-gql-playground.vercel.app/string-component" />

## How to update

> Check out [this getting started guide](/docs/setup-overview/) if you want to get started with tina
Expand All @@ -48,13 +34,13 @@ So previously, the schema file would look like this.
```ts
export default defineSchema({
// schema here
})
});
```

must be changed to

```ts
import { defineConfig } from 'tinacms'
import { defineConfig } from 'tinacms';

export default defineConfig({
// pass schema and apiUrl to the config (required) (this is how it is passed to the fronend)
Expand All @@ -70,8 +56,8 @@ export default defineConfig({
collections: [
// ...
],
})
export default schema
});
export default schema;
```

You should add the following two files in the `.tina/components` folder.
Expand All @@ -81,8 +67,8 @@ You should add the following two files in the `.tina/components` folder.
This file handles the Tina configuration and the tina provider component, and this will only load when in edit mode, and an example below.

```js
import TinaCMS from 'tinacms'
import { tinaConfig } from '../schema.ts'
import TinaCMS from 'tinacms';
import { tinaConfig } from '../schema.ts';

// Importing the TinaProvider directly into your page will cause Tina to be added to the production bundle.
// Instead, import the tina/provider/index default export to have it dynamically imported in edit-mode
Expand All @@ -91,18 +77,18 @@ import { tinaConfig } from '../schema.ts'
* @private Do not import this directly, please import the dynamic provider instead
*/
const TinaProvider = ({ children }) => {
return <TinaCMS {...tinaConfig}>{children}</TinaCMS>
}
return <TinaCMS {...tinaConfig}>{children}</TinaCMS>;
};
```

### 4. Add `.tina/components/TinaDynamicProvider.js`

The `TinaDynamicProvider.js` handles the loading of the TinaProvider when in "Edit mode." See the provided below

```js
import dynamic from 'next/dynamic'
const TinaProvider = dynamic(() => import('./TinaProvider'), { ssr: false })
import { TinaEditProvider } from 'tinacms/dist/edit-state'
import dynamic from 'next/dynamic';
const TinaProvider = dynamic(() => import('./TinaProvider'), { ssr: false });
import { TinaEditProvider } from 'tinacms/dist/edit-state';

const DynamicTina = ({ children }) => {
return (
Expand All @@ -111,10 +97,10 @@ const DynamicTina = ({ children }) => {
{children}
</TinaEditProvider>
</>
)
}
);
};

export default DynamicTina
export default DynamicTina;
```

> [Read more](/docs/tina-folder/overview/#tinadynamicproviderjs) about these two files in our reference docs
Expand All @@ -126,8 +112,8 @@ The last step is to update your `_app.{js,tsx}`. Since the config and the provid
`_app.{js,tsx}` before:

```js
import dynamic from 'next/dynamic'
import { TinaEditProvider } from 'tinacms/dist/edit-state'
import dynamic from 'next/dynamic';
import { TinaEditProvider } from 'tinacms/dist/edit-state';
//...

const App = ({ Component, pageProps }) => {
Expand All @@ -149,24 +135,24 @@ const App = ({ Component, pageProps }) => {
<Component {...pageProps} />
</TinaEditProvider>
</>
)
}
export default App
);
};
export default App;
```

`_app.{js,tsx}` after:

```js
import DynamicTina from '../.tina/components/TinaDynamicProvider'
import DynamicTina from '../.tina/components/TinaDynamicProvider';

const App = ({ Component, pageProps }) => {
return (
<DynamicTina>
<Component {...pageProps} />
</DynamicTina>
)
}
export default App
);
};
export default App;
```

This separation of config into another file makes it much cleaner and easier to understand. In addition, the schema now being a part of the config and used on the frontend will allow functions to be passed and used. It will also allow us to make fewer network requests since we have more information.
Expand Down
11 changes: 5 additions & 6 deletions content/blog/announcing-tinacms.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,15 @@ next: content/blog/creating-markdown-drafts.mdx

Today, we’re excited to announce [TinaCMS](https://github.com/tinacms/tinacms): an open-source site editing toolkit for React-based sites (Gatsby and Next.js).

Tina is not a CMS, in the traditional sense. As in, it’s not a *separate* system for managing content. Instead, Tina adds editing functionality to your site when running in dev mode locally, or when using [Tina Teams](http://tinacms.org/teams) (cloud)...In fact, I'm writing this post with Tina right now:
Tina is not a CMS, in the traditional sense. As in, it’s not a _separate_ system for managing content. Instead, Tina adds editing functionality to your site when running in dev mode locally, or when using [TinaCloud](/docs/tina-cloud/overview) (cloud)...In fact, I'm writing this post with Tina right now:

<WebmEmbed embedSrc="/img/blog/announcing-tinacms/tina-cms-announcement-post.webm" />

When you install Tina, your site gets a floating *edit* icon in the corner that toggles an editing pane (left) to expose the CMS fields. This gives your content editors a visual editing experience that’s super intuitive. When you click "Save" Tina writes your content to external data sources, such as markdown or json files. Try the [Gatsby starter site](/docs/guides/converting-gatsby-to-tina) to see for yourself.
When you install Tina, your site gets a floating _edit_ icon in the corner that toggles an editing pane (left) to expose the CMS fields. This gives your content editors a visual editing experience that’s super intuitive. When you click "Save" Tina writes your content to external data sources, such as markdown or json files. Try the [Gatsby starter site](/docs/guides/converting-gatsby-to-tina) to see for yourself.

### Where does Tina store my content?

Currently, Tina writes to Markdown and data files and commits to Git but it can be extended to write to other data sources (think, a WordPress database, Google Sheets, Airtable, etc). When running locally, Tina writes to the file system and if you're using [Tina Teams](http://tinacms.org/teams), it commits to your GitHub/GitLab repo.
Currently, Tina writes to Markdown and data files and commits to Git but it can be extended to write to other data sources (think, a WordPress database, Google Sheets, Airtable, etc). When running locally, Tina writes to the file system and if you're using [TinaCloud](/docs/tina-cloud/overview), it commits to your GitHub/GitLab repo.

### Why Tina?

Expand All @@ -38,6 +38,5 @@ We developers have hot-reloading, and Tina is the hot-reloading for content edit

We're coming out of a monolithic CMS era and we believe next-gen sites need a next-gen CMS. Checkout Tina and let us know what you think!

* [TinaCMS Docs](https://tinacms.org/docs/getting-started/introduction)
* [TinaCMS GitHub repo](https://github.com/tinacms/tinacms)
* [Tina Forum](https://community.tinacms.org/)
- [TinaCMS Docs](https://tinacms.io/docs/getting-started)
- [TinaCMS GitHub repo](https://github.com/tinacms/tinacms)
10 changes: 5 additions & 5 deletions content/blog/dynamic-plugin-system.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -25,18 +25,18 @@ Usually plugin systems are static. We list all the plugins we need in a config a
Take the postCreatorPlugin defined below; it adds a button to the sidebar so you can create new blog posts:

```js
import slugify from 'slugify'
import slugify from 'slugify';

const postCreatorPlugin = new RemarkCreatorPlugin({
label: 'Post',
fields: [{ name: 'title', label: 'Post', component: 'text' }],
filename({ title }) {
return `content/posts/${slugify(title).toLowerCase()}.md}`
return `content/posts/${slugify(title).toLowerCase()}.md}`;
},
frontmatter({ title }) {
return { title }
return { title };
},
})
});
```

With most systems, we would add plugins at startup and would stay for the duration of the session. No matter where you were on the site, you would be able to create a “Post”. (Note: you could get around this by having the plugin hides itself, but the added responsibility complicates the API.)
Expand Down Expand Up @@ -65,4 +65,4 @@ This plugin system demonstrates how the principle of Inversion of Control influe

This approach benefits both sides: plugin authors don’t have to worry about implementing some complex configuration scheme, and developers can apply the plugin in both simple and complex use cases without resorting to hacks.

If you're interested in learning more about plugins in TinaCMS, checkout the [documentation](https://tinacms.org/docs/cms#plugins). Interested in creating your own plugin? Head over to the contribution [guidelines](https://tinacms.org/docs/contributing/guidelines). Feel free to post any questions or comments in the [Tina Discord](https://discord.com/invite/zumN63Ybpf).
Interested in creating your own plugin? Head over to the contribution [guidelines](https://tinacms.org/docs/contributing/guidelines). Feel free to post any questions or comments in the [Tina Discord](https://discord.com/invite/zumN63Ybpf).
Loading

0 comments on commit 2a324b1

Please sign in to comment.