Wagtail Setup and Development
In the Terminal of VSCode, run the local server:
#change to the directory your project is located in
python manage.py runserver
If at this step you encounter a message saying that you have
x amount of unapplied migrations, please refer to the Performing Django migrations on the Docker container section on the Docker page. Come back to this page after you have applied the migrations to your Docker database.
You should now be able to develop inside the Docker container. However, before you will be able to see your development version of the site on localhost:8000, you must configure the Wagtail CMS (content management system).
Going to localhost:8000 without setting up Wagtail, you will see a blank site that says 'Welcome to your new Wagtail site'.
- 1.Create a new root page (other than the currently existing 'Welcome to your new Wagtail site!'). Your new page should not be a child page of the default 'Welcome' site.
To 'compile' static files such as CSS during development, run
gulp buildDevin the folder where gulp is installed.
Building static files with gulp is a step in front-end development which is somewhat analogous to compiling.
If you see that there is no CSS styling applied to the HTML in (http://localhost:8000/), you may need to set-up
In the Docker container (i.e. in the VSCode workspace Terminal):
- 1.Install the required Node packages with npm:cd /workspaces/ubyssey.ca/ubyssey/static_src/npm install
- 2.Install a global version of gulp (if you don't have it already) and build the static files:npm install -g gulpgulp buildDev
_If you run into any error while installing npm or gulp, remove
rm -rf node_modules.
Download and unzip the sample media folder to
ubyssey-dev/ubyssey.ca/media/. This will make it so the images attached to the sample articles are viewable.