Getting started
Create your own spacebook exactly like this one and customize it to your needs. Spacebooks are speedy to set up, free, and 100% open source.
- Easy to use ๐ โ add a new page and it appears magically in your navigation, make edits right from your phone
- Writing focused โค๏ธ โ beautiful typography and a minimalist design managed with easy-to-use Markdown
- Speedy and accessible ๐ โ static files, responsive system fonts, minimal JavaScript, purge and minify All the Things, accessible to all people and devices
- Privacy first ๐ โ User-agent: * Disallow: / is set by default with noreferrer set on all links; encrypt your full site with a password if desired
- Flexible ๐ช โ disable features you donโt need, add advanced features with serverless functions or Alpine.js
Spacebooks are modern notebooks you can use to create documentation, sketch out new ideas, or whatever suits your fancy.
Launch a new spacebook
You can launch your own spacebook and deploy it to the cloud on Netlify with the click of a button. Youโll need an existing Github account and a Netlify account (which you can create during this process if you wish):
This process will automatically copy the spacebook repository to your own personal Github account. Once complete, your new spacebook will be automatically deployed on Netlify and ready for customization. ๐
What is a spacebook?
A spacebook is a simple website generator that will help you create your own project just like this one using a bunch of cool, modern, and fast technology:
- Eleventy a super fast Node-based static site generator that stays out of your way and lets you ship only what you want to ship ๐
- Tailwind 2.0 a brilliant and tiny utility-first CSS framework ๐จ
- Alpine.js a minimal utility-first framework for simple or advanced JavaScript ๐น๏ธ
- Elasticlunr a lightweight full-text search engine ๐
- Advanced Markdown-it support with footnotes, custom containers, emoji support, tables, task lists, and auto-linked images โ๏ธ
- Netlify for cloud hosting and one-click installs, easy form support, and an automated Github deployment pipepline ๐ค
- Netlify CMS (optional) to provide an easy Markdown editor for creating and changing content with optional Cloudinary support for advanced image management. ๐ป
Donโt worry; you donโt need to know or understand any of this to launch a spacebook but it results in a speedy, easy-to-use, and accessible website that typically scores 100s across the board on Google Lighthouse metrics for mobile and desktop:
Did you know? If you enable the optional Netlify CMS or add an analytics script, you may lose 1-3 performance points but this is a pretty swell starting point. ๐
If you wish, you may customize your spacebook or use it as the basis for your creating your own starter. It was built on the shoulders of giants.
Who needs a spacebook?
A spacebook is for anybody who believes in the #indieweb and wants a simple, modern, and free way to put a notebook-like thing on the web that they own and control:
- Writers and thinkers
- Planners and dreamers
- Technical doc writers
- Project managers
- Teachers and students
Anybody who is willing to learn a few simple things can create as many spacebooks as theyโd like for any reason in the world.
Install spacebook
In theory, you can launch a spacebook without ever downloading the code or running your site locally. Just click that big green button and edit your files directly on Github! (The Github UI is fairly mobile friendly, and it is entirely possible to launch and manage a spacebook entirely via your phone ๐)
But if you want to customize your codebase or write your Markdown files in a local editor, youโll want to download and install your site locally.
Requirements
You must be running Node version 12 or higher due to the Tailwind 2.0 release. I recommend using NVM to easily manage your Node versions if you need to switch back and forth between older versions.
To find your current node version:
node --version
Step one
If already have a Github repository from a Netlify install, simply clone a copy of your new repository:
git clone https://github.com/<your-username>/<your-repository>
If you just want to try this out locally, you can clone the Spacebook repository directly:
git clone https://github.com/broeker/spacebook
Note: If you choose the second option, youโll need to remove the existing .git folder and add your own upstream repository if you want to use this as a basis for moving forward. You can also simply copy or fork the repository directly from Github.
Step two
Install the site and run an initial build command:
cd spacebook
npm install
npm run build (only necessary the first time!)
If you get errors here, double check your node version!
Step three
Now spin up your local server to see your site!
npm run start
This command will start a local server and youโll be able to work on your site with hot reloads and some nice Browsersync features. If you install your site locally without connecting it to Netlify, you can easily do so later by moving your code into its own Github repository, and then creating a new Netlify site connected to that repository. ๐ฅ