minimal-flask-preact

This package generates a minimalistic template for building a full-stack web application with Flask and Preact.

🔥 Features

• Preact 10.x
• Flask 1.1.x
• Typescript 3.9.x
• Webpack 4.x
• Jest 26.x

💁 Getting Started

First, install the package from npm.

npm install -g minimal-flask-preact

After downloading, you can create a new project with the following command.

minimal-flask-preact create my-project

📋 Project Structure

Your project directory should now look like this.

tree my-project
my-project
├── jest.config.js
├── package.json
├── public
│   └── index.html
├── server
│   ├── config.py
│   ├── requirements.txt
│   ├── routes
│   │   └── hello_world.py
│   ├── server.py
│   └── tests
│       └── test_hello_world.py
├── src
│   ├── __tests__
│   │   └── hello_world.test.tsx
│   ├── app.tsx
│   ├── components
│   │   └── button.tsx
│   ├── store
│   │   └── store.tsx
│   └── views
│       └── hello_world.tsx
├── tsconfig.json
├── webpack.dev.js
└── webpack.prod.js

🚀 Frontend

To initialize your project use npm init.

cd my-project && npm init
npm install

You can start the webpack development server with this command.

npm run dev

To create a javascript bundle file for production use the provided script build.

npm run build

🤖 Backend

It is a good practice to create a virtual environment when working on the backend. You can create an environment in Python with python -m venv {name}.

cd server && python3 -m venv venv
source venv/bin/activate

Use pip to install the related dependencies for the backend.

pip install -r requirements.txt

A Flask app relies on some environment variables which must be set in order to safely deploy the application on a public server.

export SECRET_KEY=XXX
export APP_SETTINGS=config.DevelopementConfig

To start the Flask server call server.py.

python server.py