Website of Python Canarias 🚀 happily made with Django.

• Python dependencies
• Node.js dependencies
• EditorConfig
• Customize your settings
• Database
• Media
• Launching services
• API
• Adding a new section (app) to the project

This project recommends the use of virtual environments. The requirements.txt contains the packages for production, while requirements-dev.txt includes the additional requirements for development.

Some advantages of using virtual environment are:

• Isolates the Python environment from the system.
• It is easy to duplicate the production environment.
• It is easy to duplicate the development environment.
• GitHub enables security checks on the requirements files.
• You can use virtualenv-wrapper, which is ❤️.

🐍 Note: The procedure assumes python3 in your system executes a version of Python 3.6 or upper.

1. Install virtualenv and (encouragingly) virtualenv-wrapper.
2. Clone the repository: git clone [email protected]:pythoncanarias/web.git
3. Change to the project directory. Create the virtual environment and install all the dependencies for the project with the next lines:

    $ mkvirtualenv -a . -p $(which python3) pycanweb
    $ pip install requirements.txt
    $ pip install requirements-dev.txt  # For developers

This will install a virtual environment called pycanweb for the project, with Python 3, Django and all the rest Python dependencies.

Minimal versions of the required tools:

• npm >= 5.6.0
• node >= 9.11.2
• gulp (cli) >= 2.0.1
• gulp (local version) >= 4.0.0

There are some libraries (css, js) used on either the frontend or the development phase. To install them, make:

$ npm install

⚠️ This will create a bunch of folders and files under node_modules.

In order to use gulp correctly it is necessary to install:

$ sudo npm install --global gulp-cli

Please install the corresponding extension of EditorConfig in your favorite editor. Thus your editor will pick the settings stored in .editorconfig.

This configuration avoids conflicts with a lot of settings, mainly with tabs widths.

Feel free to change some of the settings creating a file called .env on the root of the project.

We are using PostgreSQL as database management system. In order to configure the project correctly it is important to follow some indications:

1. Install PostgreSQL.
2. Create a database and a user/password with full access to that database.
3. Set the following keys in the .env file: DATABASE_NAME, DATABASE_USER and DATABASE_PASSWORD.

Afterwards you can apply migrations with:

$ workon pycanweb  # Activation of virtualenv
$ ./manage.py migrate

In order to create a user for the admin site of Django you should:

$ workon pycanweb
$ ./manage.py createsuperuser

Initially (and obviously) the database will be empty. Some fixtures will be needed to work with.

It is important to properly set the key MEDIA_ROOT in the file .env for the server to locate the media assets.

In order to properly develop, you have to launch the following services:

• Django development server:

    $ workon pycanweb
    $ ./manage.py runserver

• Gulp build system for static assets:

    $ gulp watch

After that, you'll be able to access the project on: http://127.0.0.1:8000

The changes made both in Python files or static files will be detected by the services and will reload them.

You can check the documentation of the public API.

Normally, when a new app (section) is needed in a Django project, it can be created as follows:

$ ./manage.py startapp <app>

Based on the design of our project, some further steps must be taken in order to get the app well visualized:

1. Add <app> to the APPS constant on gulp/config.js.
2. Create the file <app>/static/<app>/css/main.scss with, at least, the following content: @import "commons/static/commons/css/base";
3. Create the base template file at <app>/templates/<app>/base.html which extends from commons/templates/base.html as base.html and links to the stylesheet <app>/custom.min.css (this file is generated by gulp)
4. In order to create the corresponding item on header menu, add the app entry at commons/templates/header.html.