Get Started
Markup is a plug and play library, which means, you don't need to build or compile it into anything to be able to see what you build.
Additionally, you can run it on the client and server to produce any type of application.
Essentials Training
Learn everything about Markup including tips and best practice guides to build web interface.
Try it in-Browser
The simplest way to start is by trying it in-browser, and we have set up few project you can get started with:
- Client ToDo App with State Management (StackBlitz)
- Client Counter App (StackBlitz)
- Client Timer App (CodePen)
- Node SSR website (StackBlitz)
HTML File
The simplest way to start is by creating an
html
file and adding the following content. You can
then open it in the browser to see.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello World</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<script src="https://unpkg.com/@beforesemicolon/markup/dist/client.js"></script>
</head>
<body>
<div id="app"></div>
<script>
const { html, state } = BFS.MARKUP;
html`
<h1>Hello World</h1>
`.render(document.getElementById('app'));
</script>
</body>
</html>
Vite Project
Another amazing way to start is by using vite to create a project.
Simply run the following command:
npm create vite@latest
You are then prompted and you should:
- Enter project name
- Select
Vanilla
as the framework -
Select either
TypeScript
(prefered) orJavaScript
This will create a project in the current directory you are on. You can then follow by installing Markup.
npm install @beforesemicolon/markup
For project content, you can look at the following Web App example to have an idea on how to structure things. Markup has everything you need to start simple.