Tutorial LoadData (#367)

Added a fixtures database file to the tutorial project after updating
some content in the tutorial site (to illustrate more pages).

Co-authored-by: Roxanna Coldiron <roxanna@coderedcorp.com>

docs/contributing/index.rst

@@ -299,6 +299,25 @@ Or manually using sphinx:
 
 Output will be in ``docs/_build/html/`` directory.
 
+Updating Tutorial Documentation
+-------------------------------
+
+From time to time, the documentation for the tutorial will need to be updated. You can work directly in
+the tutorial site by loading the fixture file for its database (read more at :ref:`load-data`). 
+
+However, once you have worked in the tutorial site and gotten new screenshots for the **Getting Started** documentation,
+you will also need to update the fixture file, which is located in ``tutorial > mysite > website > fixtures``. 
+
+**These are the steps for updating the fixture:**
+
+1. From the command line, type ``python manage.py dumpdata --natural-foreign --natural-primary -e contenttypes -e auth.Permission --indent 4 > dumpdata.json``
+
+2. The dumped data file will show up in the ``website`` folder. Open it and copy/paste its contents into a new file called ``database.json``. This will fix the encoding issue you would run into otherwise. Save the new fixture file and delete the one that was dumped. Also delete the one that is currently in the ``fixtures`` folder.
+
+3. Move the ``database.json`` file into the ``fixtures`` folder. 
+
+4. For testing ``loaddata``, please review the steps at  :ref:`load-data`. 
+
 
 Publishing a New Release
 ------------------------

docs/getting_started/install.rst

@@ -50,7 +50,9 @@ Basic Installation
 
 ✨🎉 You now have Wagtail CRX up and running! 🎉✨
 
-Follow the tutorial to build :doc:`tutorial01`
+Follow the tutorial to build: :doc:`tutorial01`.
+
+You can also play around with our tutorial database. Learn more: :ref:`load-data`.
 
 
 Installing with Sass Support
@@ -96,6 +98,31 @@ When working with Sass, you will want to look at the base.html file provided at:
 ``mysite/website/templates/coderedcms/pages/base.html`` to load in any custom
 CSS or JavaScript as needed.
 
+.. _load-data:
+
+Adding Our Tutorial Database
+----------------------------
+
+You can follow along with our tutorial and upload your own pictures and content; however,
+we have included our database data from our tutorial project so you can take a tour inside of
+the project and play around with it. The database is located in ``website > fixtures > database.json``.
+
+Follow these steps to upload it:
+
+1. Navigate to the tutorial project in the Command Line by going to ``coderedcms > tutorial > mysite``. 
+
+2. In a fresh virtual environment, type ``pip install -r requirements.txt`` to set up the requirements for the project.
+
+3. Set up your database like usual. If you want to use a database other than the default ``sqlite3``, you will need to set it up first. It will be an empty database for now.
+
+4. Do the initial migration for the tutorial site with ``python manage.py migrate``.
+
+5. Navigate to the ``database.json`` file in the Fixtures folder and copy the path to the file. 
+
+6. From the Command Line, type ``python manage.py loaddata "path/to/database.json"``, replacing that last part with the correct path to the file.
+
+7. Check to see if it worked by running ``python manage.py runserver``. You should now see our tutorial project with all of the content we have added to the site. It's ready for you to play around with it!
+
 
 Starter Templates
 -----------------

tutorial/mysite/website/static/website/css/custom.css

@@ -13,6 +13,13 @@
     color: #f75990;
 }
 
+.cherry-headers h1, 
+.cherry-headers h2,
+.cherry-headers h3,
+.cherry-headers h4 {
+    color: #f75990;
+}
+
 .border-cherry {
     border: 10px solid #f75990;
 }