The official website for Clayton TV

*This is a demo site, soon to undergo substantial changes! Join our hackathon!

Getting Started

To get started, you'll need to install a few things. All the tech used is cross-platform, but there will still be a few differences for macOS, Windows and Linux users.

Please follow the instructions carefully, and raise an issue for anything that doesn't work!

Prerequisites

One of the following code editors (aka an Integrated Development Environment, or IDE)

• VS Code (Free! You'll likely want the Django extension too)
• PyCharm (Pycharm Community is free, Pycharm Pro is Paid/Trial. Or, download the toolbox and install the Release Candidate, which is free but not always stable.)
• If you dare, you can use Atom, Sublime, or (please don't) Notepad++.

GitHub Desktop (A nice UI for git, the version management software. It will install git for you if you don't already have it.)

• https://desktop.github.com/ (Mac and Windows only. Linux users, you're likely familiar with terminal commands anyway, but check out Oh-My-Zsh and their git plugin)

Python (the programming language that our Django app uses)

• Python 3.12.3 (Select the Windows installer (64-bit) or macOS 64-bit universal2 installer, depending on your OS. Linux users you can follow this guide)
• Note: for users that use an existing Python version, don't worry, you can have multiple versions installed at a time. We'll use pipenv to auto-configure the app to use 3.12.

Node.js (for the front-end design of our app)

• Node 20.12.2 LTS (Long-Term Support, or LTS, means that it will get features and security updates for longer)
• Alternatively, for Mac or Linux users, check out Node Version Manager. This requires technical skill to set up.

Install instructions

Clone the repo in Github Desktop, or run the following command in a terminal window (Note: you may need to use a Command Prompt on Windows, as a git shell or PowerShell may not work).

git clone git@github.com:Clayton-TV/claytontv

Open the project in your editor, or change directory into the project

cd claytontv

Set up python environment

# Install pipenv
python3.12 -m pip install pipenv

#Above command may fail in MacOS (x86_64 Intel chip) - instead this works, then continue as before.
brew install pipenv

# Start pipenv
pipenv shell

Install python dependencies

pipenv install

Install the node dependencies

npm install

Run the migrations

python manage.py migrate

Launch the app

# Run the python server (backend)
python manage.py runserver

Open a new terminal window, using the virtual environment as before, and run:

# Run the vite server (frontend)
npm run dev

Go to http://localhost:8000 and you should see the image at the top of this README file.

Troubleshooting

1. npm install error - Check you're in the right place - "cd" or do from VSCode
2. python not found - check environment variables - add python to the path and restart
3. commands need "pipenv run" prefix

Useful Tips

1. On windows you can open cmd at a specific folder by navigating there and typing CMD in the location bar of the explorer window.

Contributing

To report a bug, please raise an issue. Include steps to replicate and a screenshot of the error.

To suggest a feature, please raise an issue. Add a brief summary of the changes and any additional details.

To commit changes, please create a branch in the pattern of bug/title-of-bug or feature/title-of-feature.

Licence