Working with templates¶
Default storefront templates are based on Bootstrap 4.
You can find the files under
Working with front-end assets¶
All static assets live in subdirectories of
Everything is compiled together using webpack module bundler.
The resulting files are written to
/saleor/static/assets/ and should not be edited manually.
During development it’s very convenient to have webpack automatically track changes made locally. This will also enable source maps that are extremely helpful when debugging.
To run webpack in watch mode run:
$ npm start
Files produced this way are not ready for production use. To prepare static assets for deployment run:
$ npm run build-assets --production
Working with backend code¶
To guarantee repeatable installations all project dependencies are managed using pip-tools.
Project’s direct dependencies are listed in
requirements.in and running
requirements.txt that has all versions pinned.
We recommend you use this workflow and keep
requirements.txt under version control to make sure all computers and environments run exactly the same code.
Before you make any permanent changes in the code you should make sure they do not break existing functionality.
The project currently contains very little front-end code so the test suite only covers backend code.
To run backend tests use pytest:
You can also test against all supported versions of Django and Python. This is usually only required if you want to contribute your changes back to Saleor. To do so you can use Tox:
The storefront ships with a working CircleCI configuration file. To use it log into your CircleCI account and enable your repository.
Using Docker to build software allows you to run and test code without having to worry about external dependencies such as cache servers and databases.
The following setup is only meant for local development. See Docker for production use of Docker.
You will need to install Docker and docker-compose before performing the following steps.
Our configuration exposes PostgreSQL, Redis and Elasticsearch ports. If you have problems running this docker file because of port conflicts, you can remove ‘ports’ section from docker-compose.yml
$ npm install
Prepare static assets
$ npm run build-assets
Build the containers using
$ docker-compose build
Prepare the database
$ docker-compose run web python manage.py migrate $ docker-compose run web python manage.py collectstatic $ docker-compose run web python manage.py populatedb --createsuperuser
--createsuperuserswitch creates an admin account for
firstname.lastname@example.org the password set to
Run the containers
$ docker-compose up
By default, the application is started in debug mode, will automatically reload code and is configured to listen on port
To keep a consistent code structure we follow some rules of naming files. Templates use underscore as a word separator and static files, as they end up as a part of URL, use dashes.