Skip to content

Commit c82e79d

Browse files
committed
chore: push markdown
1 parent 715d714 commit c82e79d

10 files changed

+739
-0
lines changed

biolink/introduction.mdx

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
export const description =
2+
'A versatile and minimalist Next.js Biolink template designed for modern developers.'
3+
4+
export const sections = [
5+
{ title: '🚀 Features', id: 'features' },
6+
{ title: '💻 Requirements', id: 'requirements' },
7+
{ title: '💳 Credits', id: 'credits' },
8+
]
9+
10+
# Next.js Biolink Template
11+
12+
<div>
13+
<img src="https://r2.interrupted.me/uploads/xBi7LoRy.png"
14+
alt="Resynced Next.js Template Logo"
15+
className="w-full max-w-full h-auto object-contain mx-auto block" />
16+
</div>
17+
18+
---
19+
20+
<Note>
21+
This template is a **frontend-only solution** and does not include a backend. If your project requires backend functionality, explore complementary templates or tutorials for backend integration.
22+
</Note>
23+
24+
Welcome to the **[Next.js Biolink Template](https://github.com/ResyncedDesign/NextJSTemplate)** — a thoughtfully designed, open-source template tailored to meet the needs of modern developers (*and remove excessive gate-keeping*).
25+
26+
Whether you're a seasoned developer or just beginning your journey, this template provides a robust starting point. With its intuitive design, optimized integrations, and high performance, you can quickly build biolink pages with confidence and ease.
27+
28+
## 🚀 Features
29+
30+
- **Theme Support:** Easily add new themes to your biolink.
31+
- **SSR:** Everything is rendered server-side to protect your API.
32+
- **Optimized Performance:** Built with NextJS to deliver exceptional speed and scalability.
33+
- **Customizable and Extensible:** Modify and expand the template to fit your unique requirements without compromising on usability.
34+
35+
## 💻 Requirements
36+
37+
To use this template, ensure your environment meets the following prerequisites:
38+
39+
- **Node.js**: v16 or later
40+
- **Next.js**: v15 or later
41+
- Familiarity with basic React and Next.js concepts
42+
43+
For more info on deployment, read [here](/biolink/deploy).
44+
45+
## 💳 Credits
46+
47+
This template draws inspiration and resources from the following:
48+
49+
- **Talus Template:** Used for the clean and responsive landing page design.
50+
- **Wanted.lol:** The biolink page design serves as the visual foundation for this project.
51+
52+
---
53+
54+
Take the first step toward creating your next project:
55+
56+
<div className="not-prose mb-16 mt-6 flex gap-3">
57+
<Button href="/biolink/getting-started" arrow="right" children="Getting Started" />
58+
</div>

cloudflare/api-keys.mdx

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
export const description =
2+
'Learn how to configure Cloudflare API keys for the Go Uploader Template. A step-by-step guide to generating R2 API tokens and integrating them into your project.'
3+
4+
# Getting Your Cloudflare R2 API Keys
5+
6+
Before you can use the Uploader Template, you need to set up your Cloudflare API keys. This guide will walk you through the process.
7+
We will assume you have already set up your Cloudflare account and have a domain name managed in Cloudflare.
8+
9+
1. **Open Cloudflare's dashboard**.
10+
- Go to [Cloudflare](https://dash.cloudflare.com).
11+
2. **Navigate to the R2 Object Storage**.
12+
- Click on the `R2 Object Storage` tab in the left sidebar.
13+
<div>
14+
<img src="https://r2.interrupted.me/zZz/urem.png" alt="Navigating to R2 Object Storage" />
15+
</div>
16+
3. **Create a new API token**.
17+
- Assuming you have already set up your R2 bucket, click on `Manage R2 API Tokens`.
18+
<div>
19+
<img src="https://r2.interrupted.me/zZz/ooxj.png" alt="Managing R2 API Tokens" />
20+
</div>
21+
- Click on `Create API Token`.
22+
<div>
23+
<img src="https://r2.interrupted.me/zZz/bjrs.png" alt="Creating an R2 API Tokens" />
24+
</div>
25+
4. **Configure the API token**.
26+
- Give your token a name and select the permissions you want to grant. In our case `Object Read & Write` is sufficient.
27+
- It is recommended to Specify a bucket to limit the token's access.
28+
<div>
29+
<img src="https://r2.interrupted.me/zZz/4dhx.png" alt="Configuring the API Token" />
30+
</div>
31+
- After configuring the token, scroll down and click on `Create API Token`.
32+
5. **Copy the Values To Your .env**.
33+
- Copy the `Access Key ID`, `Secret Access Key` and `jurisdiction endpoint url` values to your `.env` file.
34+
<div>
35+
<img src="https://r2.interrupted.me/zZz/9ndj.png" alt="Copying the API Token Values" />
36+
</div>
37+
- Your `.env` file should look like this:
38+
```bash
39+
PORT=":your-port"
40+
41+
CLOUDFLARE_R2_ACCESS_KEY_ID="Access Key ID"
42+
CLOUDFLARE_R2_SECRET_ACCESS_KEY="Secret Access Key"
43+
CLOUDFLARE_R2_BUCKET="Your Bucket Name"
44+
CLOUDFLARE_R2_ENDPOINT="https://12sd3aasd12sd23sd123.r2.cloudflarestorage.com"
45+
R2_URL="https://r2.example.com"
46+
```
47+
6. **Start the Application**.
48+
- Run the application locally to test your setup:
49+
```bash
50+
go run src/main.go
51+
```
52+
- You’ll see the server start successfully, indicating the app is live. By default, it will run on http://localhost:your-port.
53+
- Test it using a tool like [Postman](https://www.postman.com/) or [Insomnia](https://insomnia.rest/).

cloudflare/index.mdx

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
export const description =
2+
'Step-by-step guide to setting up Cloudflare R2 for the Go Uploader Template. Learn how to create buckets, configure CORS policies, and connect a custom domain.'
3+
4+
# Setting Up Cloudflare R2
5+
6+
Before you can use the Uploader Template, you need to set up your Cloudflare R2. This guide will walk you through the process.
7+
We will assume you have already set up your Cloudflare account and have a domain name managed in Cloudflare.
8+
9+
1. **Open Cloudflare's dashboard**.
10+
- Go to [Cloudflare](https://dash.cloudflare.com).
11+
2. **Navigate to the R2 Object Storage**.
12+
- Click on the `R2 Object Storage` tab in the left sidebar.
13+
<div>
14+
<img src="https://r2.interrupted.me/zZz/urem.png" alt="Navigating to R2 Object Storage" />
15+
</div>
16+
3. **Create a new bucket**.
17+
- Click on the `Create Bucket` button.
18+
<div>
19+
<img src="https://r2.interrupted.me/zZz/w9fr.png" alt="Creating a new bucket" />
20+
</div>
21+
- Enter a name for the bucket.
22+
- Choose a region. (We recommend choosing `Automatic`).
23+
- Choose a storage class. (We recommend choosing `Standard`).
24+
- Click on the `Create Bucket` button.
25+
<div>
26+
<img src="https://r2.interrupted.me/zZz/laax.png" alt="Configuring the bucket" />
27+
</div>
28+
4. **Configure the bucket**.
29+
- Click on the `Settings` tab.
30+
<div>
31+
<img src="https://r2.interrupted.me/zZz/f1a6.png" alt="Opening the bucket settings tab" />
32+
</div>
33+
- Scroll down until you see the `Public Access` section.
34+
- Click on `Connect Domain`.
35+
<div>
36+
<img src="https://r2.interrupted.me/zZz/9ruo.png" alt="Public Access section" />
37+
</div>
38+
- It is recommended to use a subdomain for the bucket. For example, `cdn.example.com`.
39+
- Click on the `Continue` button.
40+
<div>
41+
<img src="https://r2.interrupted.me/zZz/nyak.png" alt="Connecting a domain" />
42+
</div>
43+
- Preview the DNS record that will be created. If everything looks good, click on the `Connect domain` button.
44+
<div>
45+
<img src="https://r2.interrupted.me/zZz/skfw.png" alt="Previewing the DNS record" />
46+
</div>
47+
- Wait for the DNS record to propagate. After that, you can access your bucket using the subdomain you chose.
48+
5. **Adding a CORS Policy**.
49+
- Scroll down until you see the `CORS Policy` section.
50+
- Click on `Add CORS Policy`.
51+
<div>
52+
<img src="https://r2.interrupted.me/zZz/h31p.png" alt="Adding a cors policy" />
53+
</div>
54+
- Enter the following configuration:
55+
```json
56+
[
57+
{
58+
"AllowedOrigins": [
59+
"http://127.0.0.1:3000",
60+
"https://example.com"
61+
],
62+
"AllowedMethods": [
63+
"GET",
64+
"POST",
65+
"DELETE",
66+
"PUT",
67+
"HEAD"
68+
]
69+
}
70+
]
71+
```
72+
- The above configuration allows requests from the specified origins and methods. You can modify it according to your needs.
73+
- Click on the `Save` button.
74+
75+
That's it! You have successfully set up your Cloudflare R2 Object Storage. You can now use it with the Uploader Template.
76+
77+
### Next Steps
78+
79+
<div className="not-prose"><Button href="/cloudflare/api-keys" variant="text" arrow="right" children="How to get an API key" /></div>

giveaway-bot/deploy.mdx

+109
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
2+
# Deployment Guide
3+
4+
Follow this guide to deploy your **Discord.js Giveaway Bot** to a production environment. This ensures your bot runs reliably 24/7.
5+
6+
## 1. Prerequisites
7+
8+
Before deploying, ensure the following:
9+
10+
- **Bot Token** and **Client ID** from the [Discord Developer Portal](https://discord.com/developers/applications).
11+
- A cloud hosting service or server (e.g., **VPS**, **Heroku**, **Railway**, or **AWS**).
12+
- **Node.js** (v16 or later) and **npm** installed on your server.
13+
14+
## 2. Preparing the Bot for Production
15+
16+
1. **Install Dependencies**: Ensure all project dependencies are up-to-date.
17+
```bash
18+
npm install
19+
```
20+
21+
2. **Set Environment Variables**: Configure your `.env` file with the production values:
22+
```bash
23+
BOT_TOKEN=YOUR_DISCORD_BOT_TOKEN
24+
CLIENT_ID=YOUR_DISCORD_CLIENT_ID
25+
```
26+
27+
3. **Build the Bot**: To be able to run the bot, you need to build it first:
28+
```bash
29+
npm run build
30+
```
31+
32+
4. **Test Locally**: Run the bot to ensure no errors occur:
33+
```bash
34+
npm start
35+
```
36+
37+
## 3. Deploying to a Server
38+
39+
### Option 1: Using a Virtual Private Server (VPS)
40+
1. Use a service like **DigitalOcean**, **Linode**, or **AWS EC2** to set up a server.
41+
2. SSH into the server:
42+
```bash
43+
ssh user@your-server-ip
44+
```
45+
3. Install Node.js and clone your project repository:
46+
```bash
47+
sudo apt update
48+
sudo apt install nodejs npm
49+
git clone https://github.com/YourUsername/DiscordGiveawayBot.git
50+
cd DiscordGiveawayBot
51+
npm install
52+
```
53+
4. Add your `.env` file and start the bot:
54+
```bash
55+
npm start
56+
```
57+
58+
To keep the bot running continuously, use **PM2**:
59+
```bash
60+
npm install -g pm2
61+
pm2 start npm --name giveaway-bot -- start
62+
pm2 save
63+
pm2 startup
64+
```
65+
66+
### Option 2: Deploying on Railway or Heroku
67+
68+
#### Railway
69+
1. Go to [Railway](https://railway.app) and create a new project.
70+
2. Link your GitHub repository.
71+
3. Add environment variables under **Settings > Variables**.
72+
4. Deploy the bot.
73+
74+
#### Heroku
75+
1. Install the [Heroku CLI](https://devcenter.heroku.com/articles/heroku-cli).
76+
2. Log in and create a new app:
77+
```bash
78+
heroku login
79+
heroku create
80+
```
81+
3. Add your environment variables:
82+
```bash
83+
heroku config:set BOT_TOKEN=YOUR_BOT_TOKEN CLIENT_ID=YOUR_CLIENT_ID
84+
```
85+
4. Push your code to Heroku:
86+
```bash
87+
git push heroku main
88+
```
89+
90+
## 4. Database Setup
91+
92+
1. If using a cloud SQL provider (e.g., **Supabase**, **Railway**, **AWS RDS**), create a new database instance.
93+
2. Obtain your **connection string** and set it in your `.env` file under `DATABASE_URL`.
94+
3. Run migrations or initialize the database if required.
95+
96+
## 5. Monitoring and Logs
97+
98+
To monitor your bot and check for issues:
99+
100+
- **PM2**: Use `pm2 logs` to view live logs.
101+
- **Heroku**: Use `heroku logs --tail` to monitor logs in real time.
102+
- **Railway**: View logs in the Railway dashboard.
103+
104+
## 6. Keeping the Bot Online
105+
106+
If deploying to a VPS, ensure the bot restarts automatically after downtime:
107+
108+
- Use **PM2** or **systemd** for process management.
109+
- Regularly monitor your server's health.

giveaway-bot/getting-started.mdx

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
# Getting Started
2+
3+
To set up your **Discord.js Giveaway Bot**, follow these steps:
4+
## 1. Environment Setup
5+
6+
1. Clone the repository to your local machine:
7+
```bash
8+
git clone https://github.com/ResyncedDesign/DiscordGiveawayBot.git
9+
cd DiscordGiveawayBot
10+
```
11+
12+
2. Install dependencies:
13+
```bash
14+
npm install
15+
```
16+
17+
3. Create a `.env` file in the root directory and add your **Bot Token** and **Client ID**:
18+
```bash
19+
BOT_TOKEN=YOUR_DISCORD_BOT_TOKEN
20+
CLIENT_ID=YOUR_DISCORD_CLIENT_ID
21+
```
22+
You can get the Bot Token and Client ID from the [Discord Developer Portal](https://discord.com/developers/applications).
23+
24+
4. Build the bot to be able to run it properly.
25+
```bash
26+
npm run build
27+
```
28+
29+
## 2. Invite the Bot to Your Server
30+
31+
To invite your bot to a Discord server, use the following OAuth2 URL:
32+
33+
```plaintext
34+
https://discord.com/oauth2/authorize?client_id=YOUR_CLIENT_ID&permissions=8&scope=bot%20applications.commands
35+
```
36+
37+
Replace `YOUR_CLIENT_ID` with the actual Client ID of your bot.
38+
39+
1. Open the URL in your browser.
40+
2. Select your server and click **Authorize**.
41+
42+
The bot should now be added to your server!
43+
44+
## 3. Configuring the Bot
45+
46+
Once the bot is in your server, you can configure its settings using the provided slash commands:
47+
48+
### `/gsetting`
49+
Use this command to change the giveaway embed color and emoji.
50+
51+
- Example:
52+
```
53+
/gsetting color #ff5733 emoji 🎉
54+
```
55+
This sets the embed color to `#ff5733` and the emoji to 🎉.
56+
57+
### `/gcreate`
58+
Use this command to create a giveaway.
59+
60+
- Syntax:
61+
```
62+
/gcreate time numberofwinners prize
63+
```
64+
- Example:
65+
```
66+
/gcreate 1h 2 Nitro Subscription
67+
```
68+
This creates a giveaway lasting **1 hour** with **2 winners** for a **Nitro Subscription**.
69+
70+
---
71+
72+
## 4. Running the Bot
73+
74+
Start the bot with the following command:
75+
```bash
76+
npm run start
77+
```
78+
79+
The bot should now be online and ready to manage giveaways in your server!
80+
81+
For more advanced configurations and troubleshooting, refer to the [documentation](/giveaway-bot/deploy).

0 commit comments

Comments
 (0)