This is the basic JavaScript template for Mastro. If you're not already viewing this on github.dev, open it.
- Click Install in the small dialog in the bottom right that says "Do you want to install the recommended extensions from mastro and FAST for this repository?"
- Click Trust Publishers & Install
- Close the two tabs of the just installed extensions (Mastro and FAST Tagged Template Literals) and switch back to the Explorer view by clicking the topmost icon ⧉ in the activity bar on the left. Now you should see your files and folders again.
On your keyboard, hit Ctrl-Shift-P (Windows or Linux) or Command-Shift-P (Mac), type mastro, and when the mastro: Preview and Generate Website item appears, hit enter.
Try to remember how to open the Mastro preview pane, as you might sometimes close it.
Using Firefox?
In Firefox, this keyboard shortcut unfortunately opens a new incognito window. Instead, you need to hit Ctrl-P (Windows or Linux) or Command-P (Mac) and type >mastro (note the >).
While you can play around in the template repository, if you want to save your changes, you need to create your own copy of the repo. If you haven't done so already:
- Open this template's GitHub repo
- Click the green button Use this template on the top right, select Create a new repository and choose a name for your project. (To deploy to GitHub Pages for free, your repo needs to be public.)
- On your repo's GitHub page, press
.on your keyboard to again open Visual Studio Code for the Web.
Congratulations! If the above worked, you can skip the "Setup" chapter of the Mastro guide and continue with learning HTML, CSS, or JavaScript. Or if you know that already, jump to:
- Publish your website to GitHub Pages
- Client-side vs server-side JavaScript, SPA vs MPA
- Mastro components and routing
- Build a static blog from markdown files
For a condensed overview of the Mastro web framework and static site generator, consult the Mastro Docs.
We're looking to build an inclusive community, where people of all kinds of backgrounds and experience levels feel welcome and safe, and help each other out. A place to ask questions and learn new things.
Do you have a question, need help, or want to talk about future plans? Start a GitHub discussion
Something not working as expected? We consider that a bug. Open a GitHub issue