docs: use regular case for Tiptap
This commit is contained in:
@@ -6,7 +6,7 @@ tableOfContents: true
|
||||
# Alpine.js
|
||||
|
||||
## Introduction
|
||||
The following guide describes how to integrate tiptap with your [Alpine.js](https://github.com/alpinejs/alpine) project.
|
||||
The following guide describes how to integrate Tiptap with your [Alpine.js](https://github.com/alpinejs/alpine) project.
|
||||
|
||||
For the sake of this guide we’ll use [Vite](https://vitejs.dev/) to quickly set up a project, but you can use whatever you’re used to. Vite is just really fast and we love it.
|
||||
|
||||
@@ -20,15 +20,15 @@ If you already have an existing Alpine.js project, that’s fine too. Just skip
|
||||
For the sake of this guide, let’s start with a fresh [Vite](https://vitejs.dev/) project called `tiptap-example`. Vite sets up everything we need, just select the Vanilla JavaScript template.
|
||||
|
||||
```bash
|
||||
npm init vite@latest tiptap-example -- --template vanilla
|
||||
cd tiptap-example
|
||||
npm init vite@latest Tiptap-example -- --template vanilla
|
||||
cd Tiptap-example
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
## 2. Install the dependencies
|
||||
|
||||
Okay, enough of the boring boilerplate work. Let’s finally install tiptap! For the following example you’ll need `alpinejs`, the `@tiptap/core` package and the `@tiptap/starter-kit` which has the most common extensions to get started quickly.
|
||||
Okay, enough of the boring boilerplate work. Let’s finally install Tiptap! For the following example you’ll need `alpinejs`, the `@tiptap/core` package and the `@tiptap/starter-kit` which has the most common extensions to get started quickly.
|
||||
|
||||
```bash
|
||||
# install with npm
|
||||
@@ -41,9 +41,9 @@ yarn add alpinejs @tiptap/core @tiptap/starter-kit
|
||||
If you followed step 1, you can now start your project with `npm run dev` or `yarn dev`, and open [http://localhost:3000](http://localhost:3000) in your favorite browser. This might be different, if you’re working with an existing project.
|
||||
|
||||
## 3. Initialize the editor
|
||||
To actually start using tiptap, you’ll need to write a little bit of JavaScript. Let’s put the following example code in a file called `main.js`.
|
||||
To actually start using Tiptap, you’ll need to write a little bit of JavaScript. Let’s put the following example code in a file called `main.js`.
|
||||
|
||||
This is the fastest way to get tiptap up and running with Alpine.js. It will give you a very basic version of tiptap. No worries, you will be able to add more functionality soon.
|
||||
This is the fastest way to get Tiptap up and running with Alpine.js. It will give you a very basic version of Tiptap. No worries, you will be able to add more functionality soon.
|
||||
|
||||
```js
|
||||
import Alpine from 'alpinejs'
|
||||
@@ -127,4 +127,4 @@ Now, let’s replace the content of the `index.html` with the following example
|
||||
</html>
|
||||
```
|
||||
|
||||
You should now see tiptap in your browser. Time to give yourself a pat on the back! :)
|
||||
You should now see Tiptap in your browser. Time to give yourself a pat on the back! :)
|
||||
|
||||
Reference in New Issue
Block a user