# Quick Start
If you want to use Waline in your site, please follow this guide.
# Get APP ID and APP Key
First you need sign in (opens new window) or sign up (opens new window) LeanCloud. Then go to Console (opens new window) click button Create app (opens new window) to create a new app:
After app created, we need click into it. Select Settings > App Keys at the left bottom side, then you can see APP ID
, APP Key
and Master Key
for your app!
# Deploy to Vercel
Click the blue button, and it will redirect to vercel to deploy with waline template. You need login if you have not, we recommends you sign in with Github. You can input your Vercel project name after you login.
Click Continue go to the next step,and input your new github repo name。The repo will be created and initiallized automatically base on waline example template by Vercel.
OK, repo has been initialized. It's ready to deploy to Vercel! We must set LEAN_ID
, LEAN_KEY
and LEAN_MASTER_KEY
the three environment variables in the "Environment Variables" column. The variables' value are what you get on the previous step in LeanCloud. APP ID
is the value of LEAN_ID
, and APP Key
to LEAN_KEY
, Master Key
to LEAN_MASTER_KEY
.
Click Deploy button to deploy. It will show you deploy successfully after a minitues time. It'll go to deployed site when you click Visit button. Please remember the site's url, we will use it to set serverURL
configuration in the next step.
# HTML References
Let us set the serverURL
value to the site url previous step got in the configuration object.
<head>
..
<script src='//cdn.jsdelivr.net/npm/@waline/client/dist/Waline.min.js'></script>
...
</head>
<body>
...
<div id="waline"></div>
<script>
new Waline({
el: '#waline',
path: location.pathname,
serverURL: 'https://your-domain.vercel.app'
});
</script>
</body>
# NPM
You can alose use npm (opens new window) to install Waline instead of CDN link. Install in the CLI like this:
# Install waline
npm install @waline/client --save-dev
// Use import
import Waline from '@waline/client';
// or Use require
const Waline = require('@waline/client');
new Waline({
el:'#waline',
// other config
})
# Comment Managment
Waline has a simple admin control panel, we can mange comment data in it. We can register in your site url <serverURL>/ui/register
after we deployed successfully. The first register one is administrator. You can see comment management UI after login. Collection it for the next use!