Basework 🏗
An un-opinionated base framework for web projects. See why Basework to be sold on the idea.
Usage
- Install the Basework CLI with
npm install -g basework-cli - Create a new project with
basework new - Enter the project root with
cd basework-example - Install the project packages with
npm i - Run the project locally with
basework startto start development - Open localhost:8000
Additionally, build the project locally with basework build and check the resulting dist folder to see what the project output looks like.
By building off the example project, you get these performance benefits out of the box.
Basework files
There are two files you can add to the root of your project to change the default behavior of Basework:
-
basework-config.js, which allows you to change bundlers and customize the build process:const baseworkConfig = () => ({ bundler: 'webpack', build: [ 'prepare', 'prefetch', 'transform', 'bundle', 'create', 'prerender' ] }); module.exports = baseworkConfig;
-
basework-api.js, which allows you to define custom build steps to run in the build process.
Find more information on what each build step does in the build step notes.
Get invovled
I can only take this project so far by myself. If you're excited by the ideas embedded here, please reach out @doestyhopp on Twitter or open an issue here with an idea for improvement.
Todos
- Fix relative paths pointing to target project
- Connect projects together locally with
npm packandnpm i - Create basic CLI
- Extract out any remaining target project-specific logic
- Consume
basework-config.jsfrom projects - Consume
basework-api.jsfrom projects - Refactor dev server for basic functionality
- Create an example project
- Add a license file
- Publish on npm
- Improve create pages function to support meta tags
- Webpack config differentiated by environment
- Proper hot module replacement in the dev server
- Support parcel and rollup
Longer term goals
- Create a single generalized dev server that works with any bundler
- Reduce dependency vulnerabilities to zero
- Add unit and integration tests
- Add proper CI/CD
- Create a project generator for React and Vue
- Introduce an optional
basework-routerimplementation for web components, React and Vue - Build a dedicated documentation website
Notes
This project is heavily inspired by Gatsby.