Python packages:
- Bottle
0.12.16(stable) - SQLAlchemy (with bottle-sqlalchemy)
latest - Jinja2
latest
NPM packages:
- Axios
0.18+(AJAX calls) - PostCSS/Autoprefixer
7.2+(automate CSS prefixes) - Babel
7+(turn ES6 code to vanilla) - Vue.js
2.6+(the basis of reactive web applications) - Webpack
3+with config (SCSS, ES6, Vue.js) - Web font loader
1.6+(async load font from Google Fonts)
CSS, styles:
- Bulma CSS framework
latest
Bottle is lightweight WSGI micro web-framework for Python. A simple process of installing and deploying. Everything has already been done for you. Just enjoy writing your code!
Simplify development of reactive web applications — use this kickstart kit now!
First, clone this GitHub repository:
foo@bar:~$ git clone https://github.com/koddr/bottle-vue-kickstart.gitSecond, install NPM dependencies and make build:
foo@bar:~$ cd bottle-vue-kickstart
foo@bar:~$ npm install
foo@bar:~$ npm run build # or `npm run watch` for hot-reloadThird, prepare your virtual environment:
Since 0.4.2 we use Pipenv project for manage virtual environments.
Install via pip to your system:
foo@bar:~$ pip install pipenvMore info about Pipenv here: Managing dependencies, Python.org.
And now, install Bottle with all extensions:
foo@bar:~$ pipenv installYes, virtual environment is automaticaly create. If you want to know system link, just use
pipenv --venv.Result is something like this:
/Users/username/.virtualenvs/bottle-vue-kickstart--XXXXXX.Use it in JetBrains PyCharm, VS Code or else.
Finally, run development server:
foo@bar:~$ python3 run.py
Bottle v0.12.16 server starting up (using AutoServer())...
Listening on http://localhost:8080/
Hit Ctrl-C to quit.
(Optional) Install database with example objects:
foo@bar:~$ python3 _devtools/install_init_database.pyNow, your yellow section on http://localhost:8080/ will look like this:
And we done!
├── _devtools
│ └── install_init_database.py
├── static
│ ├── assets
│ │ ├── js
│ │ │ └── script.js
│ │ └── scss
│ │ └── style.scss
│ ├── css
│ │ └── style.min.css
│ ├── images
│ │ └── bottle-vue-kickstart-logo-horizontal.svg
│ └── js
│ └── script.min.js
├── templates
│ ├── index.html
│ └── layout
│ └── base.html
├── .babelrc
├── .editorconfig
├── .gitignore
├── articles.db
├── package.json
├── package-lock.json
├── Pipfile
├── Pipfile.lock
├── postcss-config.js
├── README.md
├── run.py
└── webpack.config.js- Idea and active development by Vic Shóstak (aka Koddr).
If you want to say «thank you» or/and support active development Bottle Vue.js Kickstart:
- Add a GitHub Star to project.
- Twit about project on your Twitter.
- Donate some money to project author via PayPal: @paypal.me/koddr.
- Join DigitalOcean at our referral link (your profit is $100 and we get $25).
Thanks for your support! 😘 Together, we make this project better every day.
MIT