Starbase v4

Starbase is a production-ready static website boilerplate featuring Webpack 5, TypeScript, PostCSS & Tailwind CSS that was designed to integrate with modern Jamstack hosting providers such as Vercel, Netlify and AWS Amplify. Start building in minutes with some of the most powerful front-end technologies available in 2024, powered by a delightfully simple and fully featured developer experience.

History & Use Case

Starbase was created by Brian Staruk as a personal code styleguide and flexible project boilerplate. It is a perpetual work in progress that has been consistently maintained since early 2017 with a focus on implementing the latest industry standards and keeping all dependencies up to date.

"Simplicity is the ultimate sophistication."- Leonardo da Vinci

The primary mission of Starbase is to be sophisticatedly simple; easy to configure, extend and integrate. This also happens to make it a great platform for web developers to enhance their knowledge of bare-metal Webpack configs, TypeScript and/or Tailwind CSS.

Installation

To get started, run the command below, which will guide you through the installation process:

npx starbase@latest

Usage

It is recommended to use nvm (or nvm-windows) to manage your Node version installations. If you won't use nvm, you'll need to refer to the /.nvmrc file to verify your version of Node is compatible with the recommended version.

Getting Started

Start by ensuring you are running the recommended version of Node, and installing the project dependencies:

nvm use
npm install

Developing Locally

The dev command will serve the project source at http://localhost:3000. Any changes made within /src will recompile the source and refresh your web browser.

npm run dev

Building for Production

The build command will compile and minify the project source into /dist for integration or deployment.

npm run build

Notes & Considerations

Deploying to Hosting Environment

Starbase is setup to be deployed to the root of a web server on a hosting environment like Vercel, Netlify, etc. As such, all assets (js, css, fonts, images, etc) are referenced with absolute paths.

If you would like to instead reference assets via relative paths, so compiled .html files can be distributed and opened in a web browser without requiring a deployment to a hosting environment, you will need to remove (or comment-out) the publicPath in /webpack/webpack.config.base.ts.

If you would like to keep the absolute paths, but set it to a subdirectory instead of the root, you can change the value instead of removing it.

License

Starbase is free, open source software. Please build awesome things with it. You can buy me a beer next time you're in Boston, star the project and tell a friend, or you can erase all signs of origin and tell your coworkers that you made it yourself. It's all good!