mirror of
https://github.com/sern-handler/website
synced 2026-06-27 18:22:22 +00:00
326 lines
18 KiB
HTML
326 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<script defer>
|
||
(() => {
|
||
const { classList } = document.documentElement;
|
||
const userMode = localStorage.getItem('guide-color-scheme');
|
||
const systemDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||
|
||
if (userMode === 'dark' || (userMode !== 'light' && systemDarkMode)) {
|
||
classList.toggle('dark', true);
|
||
}
|
||
|
||
const themes = ['blurple'];
|
||
let colorTheme = localStorage.getItem('guide-color-theme');
|
||
|
||
if (colorTheme !== 'default' && !themes.includes(colorTheme)) {
|
||
colorTheme = 'default';
|
||
}
|
||
|
||
if (colorTheme !== 'default') classList.add(`guide-theme-${colorTheme}`);
|
||
})();
|
||
</script>
|
||
|
||
<link rel="stylesheet" href="./../assets/css/gstyle.css">
|
||
<link rel="icon" href="./../assets/images/icon.png">
|
||
<meta name="theme-color" content="#fff">
|
||
<meta name="twitter:card" content="summary">
|
||
|
||
<meta property="og:title" content="sern Guide">
|
||
<meta property="og:description" content="sern’s clean, modern and user-friendly guide.">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:url" content="https://sern-handler.js.org/guide-en/">
|
||
<meta property="og:locale" content="en_US">
|
||
<meta name="description" content="sern’s clean, modern and user-friendly user guide.">
|
||
|
||
<title>sern Guide - Introduction</title>
|
||
</head>
|
||
<body>
|
||
<div id="app">
|
||
<div class="theme-container">
|
||
<header class="navbar">
|
||
<div class="navbar-wrapper">
|
||
<div class="navbar-links-wrapper">
|
||
<div class="navbar-links-container"><span class="navbar-links-home">
|
||
<a aria-current="page" href="/" class="router-link-active router-link-exact-active">
|
||
<img src="./../assets/images/icon.png" style="width: 45px; margin-top: 7px;">
|
||
</a>
|
||
</span>
|
||
<nav class="navbar-links can-hide">
|
||
<div class="navbar-links-item"><a class="nav-link external"
|
||
href="https://sern-handler.js.org/#/docs/main/stable/general/welcome" rel="noopener noreferrer"
|
||
target="_blank" aria-label="Documentation">
|
||
Documentation
|
||
<span>
|
||
<svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a>
|
||
</div>
|
||
<div class="navbar-links-item"><a class="nav-link external"
|
||
href="https://discord.com/invite/QgnfxWzrcj" rel="noopener noreferrer"
|
||
target="_blank" aria-label="Documentation">
|
||
Discord Server
|
||
<span>
|
||
<svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a>
|
||
</div>
|
||
<div class="navbar-links-item"><a class="nav-link external" href="https://github.com/sern-handler/handler"
|
||
rel="noopener noreferrer" target="_blank" aria-label="GitHub">
|
||
|
||
GitHub <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg"
|
||
ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15"
|
||
height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
<div class="navbar-links-container">
|
||
<div id="docsearch-container" class="navbar-search"><button type="button"
|
||
class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg
|
||
width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20">
|
||
<path
|
||
d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z"
|
||
stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round"
|
||
stroke-linejoin="round"></path>
|
||
</svg><span class="DocSearch-Button-Placeholder">Search the guide</span></span></span>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="toggle-sidebar-button"><svg viewBox="0 0 448 512" class="icon sidebar-menu-icon">
|
||
<path fill="currentColor"
|
||
d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z">
|
||
</path>
|
||
</svg><svg viewBox="0 0 24 24" class="icon sidebar-close-icon">
|
||
<path
|
||
d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41z"
|
||
fill="currentColor"></path>
|
||
</svg>
|
||
</div>
|
||
<button class="toggle-dark-button"><svg class="icon light-icon"
|
||
focusable="false" viewBox="0 0 32 32">
|
||
<path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z"
|
||
fill="currentColor"></path>
|
||
<path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path>
|
||
<path d="M2 15.005h5v2H2z" fill="currentColor"></path>
|
||
<path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path>
|
||
<path d="M15 25.005h2v5h-2z" fill="currentColor"></path>
|
||
<path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path>
|
||
<path d="M25 15.005h5v2h-5z" fill="currentColor"></path>
|
||
<path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path>
|
||
<path d="M15 2.005h2v5h-2z" fill="currentColor"></path>
|
||
</svg><svg class="icon dark-icon" focusable="false" viewBox="0 0 32 32">
|
||
<path
|
||
d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z"
|
||
fill="currentColor"></path>
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<div class="content-wrapper">
|
||
<div class="notifications-wrapper">
|
||
<div class="notifications">
|
||
</div>
|
||
</div>
|
||
<div class="sidebar-mask"></div>
|
||
<div class="sidebar-wrapper">
|
||
<aside class="sidebar">
|
||
<nav class="navbar-links">
|
||
<div class="navbar-links-item"><a class="nav-link external"
|
||
href="https://sern-handler.js.org/#/docs/main/stable/general/welcome" rel="noopener noreferrer"
|
||
target="_blank" aria-label="Documentation">
|
||
|
||
Documentation <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg"
|
||
ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15"
|
||
height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a></div>
|
||
<div class="navbar-links-item"><a class="nav-link external" href="https://github.com/sern-handler/website"
|
||
rel="noopener noreferrer" target="_blank" aria-label="GitHub">
|
||
|
||
GitHub <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg"
|
||
ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15"
|
||
height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a></div>
|
||
</nav>
|
||
<ul class="sidebar-links">
|
||
<p class="sidebar-heading sidebar-item active">Welcome to sern</p>
|
||
<ul class="">
|
||
<li>
|
||
<a aria-current="page" href="/"
|
||
class="router-link-active router-link-exact-active nav-link sidebar-item active"
|
||
aria-label="Introduction">
|
||
Introduction
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="/whats-new.html" class="nav-link sidebar-item" aria-label="What's new">
|
||
Relase notes
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<p class="sidebar-heading sidebar-item">Walkthroughs</p>
|
||
<ul class="">
|
||
<li>
|
||
<a href="/creating-your-bot/" class="nav-link sidebar-item" aria-label="Initial files">
|
||
Understanding the sern CLI
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="/walkthrougs/first-command.html" class="nav-link sidebar-item"
|
||
aria-label="Creating commands">
|
||
Your first command
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="/walkthroughs/first-event.html" class="nav-link sidebar-item"
|
||
aria-label="Command handling">
|
||
Your first event
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="/creating-your-bot/event-handling.html" class="nav-link sidebar-item"
|
||
aria-label="Event handling">
|
||
Working with plugins
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="/creating-your-bot/event-handling.html" class="nav-link sidebar-item"
|
||
aria-label="Event handling">
|
||
What is sern Emitter?
|
||
</a>
|
||
</li>
|
||
<a href="/creating-your-bot/event-handling.html" class="nav-link sidebar-item"
|
||
aria-label="Event handling">
|
||
Conclusion
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<p class="sidebar-heading sidebar-item">Good to know</p>
|
||
<ul class="">
|
||
<a href="/creating-your-bot/event-handling.html" class="nav-link sidebar-item"
|
||
aria-label="Event handling">
|
||
Basics about sern.config.json
|
||
</a>
|
||
</li>
|
||
<a href="/creating-your-bot/event-handling.html" class="nav-link sidebar-item"
|
||
aria-label="Event handling">
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</ul>
|
||
</aside>
|
||
</div>
|
||
<main class="page">
|
||
<div class="theme-default-content">
|
||
<h1 id="introduction" tabindex="-1"><a class="header-anchor" href="#introduction" aria-hidden="true">#</a>
|
||
Introduction</h1>
|
||
<p>Welcome to sern’s official guide. This guide will go through all the core features of the framework.</p>
|
||
<ul>
|
||
<li>💖 Thank you for choosing sern to be your framework!</li>
|
||
<li>Teaching the discord.js library and/or Javascript/Typescript is out of scope of this project, so the guide assumes you already know these elements.
|
||
</li>
|
||
<li>discord.js v14 and v13.9 are the only supported version at the moment. There are plans to roll out a version of sern in discord.js@13.xx.xx in the future.</li>
|
||
</ul>
|
||
<p>This guide will also cover subjects like common errors and how to solve them, keeping your code clean,
|
||
setting up a proper development environment, etc. Sounds good? Great! Let's get started, then.</p>
|
||
<h2 id="before-you-begin" tabindex="-1"><a class="header-anchor" href="#before-you-begin"
|
||
aria-hidden="true">#</a>Explore</h2>
|
||
<ul>
|
||
<li>What is sern? & sern's Goal</li>
|
||
<li>How to use sern with it's <a href="/cli">CLI</a></li>
|
||
<li>Getting started with sern</li>
|
||
<li>What is a plugin and how to use it</li>
|
||
<li>Basics about the sern.config.json file</li>
|
||
</div>
|
||
<footer class="page-meta">
|
||
<div class="meta-item edit-link"><a class="nav-link external meta-item-label"
|
||
href="https://github.com/sern-handler/website/" rel="noopener noreferrer"
|
||
target="_blank" aria-label="Edit this page">
|
||
|
||
Edit this page <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg"
|
||
ariahidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15">
|
||
<path fill="currentColor"
|
||
d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
|
||
</path>
|
||
<polygon fill="currentColor"
|
||
points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
|
||
</polygon>
|
||
</svg>
|
||
<span class="sr-only">open in new window</span>
|
||
</span>
|
||
</a></div>
|
||
<div class="meta-item last-updated"><span class="meta-item-label">Last Updated at </span>
|
||
<span class="meta-item-info">18/07/2022, 11:48 PM</span>
|
||
</div>
|
||
</footer>
|
||
|
||
<nav class="page-nav">
|
||
<p class="inner">
|
||
<span class="next">
|
||
<a href="/guide-en/other/release-notes.html" class="nav-link"
|
||
aria-label="Relase notes">
|
||
View next page →
|
||
</a>
|
||
</span>
|
||
</p>
|
||
</nav>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script type="module" src="/assets/app.a2fc1d97.js" defer=""></script>
|
||
</body>
|
||
</html>
|
||
</body>
|
||
</html>
|