1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
# Chrona
An interactive historical timeline.
Available online.
## Project Overview
The UI is largely coded in Typescript, using the [Vue](https://vuejs.org)
framework, with [Vite](https://vitejs.dev) as the build tool. Much of
the styling is done using [Tailwind](https://tailwindcss.com). Packages
are managed using [npm](https://www.npmjs.com) and [Node.js](https://nodejs.org).
On the server side, tree data is served and generated using Python, with
packages managed using [Pip](https://pypi.org/project/pip). Tree data is
stored using [Sqlite](https://www.sqlite.org).
## Files
### Project Level
- **package.json**: Contains npm project information, such as package dependencies
- **package-lock.json**: Auto-generated by npm. Used for replicable installations
- **LICENCE.txt**: This project's license (MIT)
### Client & Server
- **src**: Contains most of the client-side code
- **tests**: Contains client-side unit tests
- **index.html**: Holds code for the main page, into which code from 'src' will be included
- **public**: Contains files to be copied unchanged in the client's production build
- **backend**: Contains code for the server, and for generating history data
### Configuration
- **vite.config.js**: For configuring Vite
- **tailwind.config.js**: For configuring Tailwind
- **postcss.config.js**: For configuring Tailwind
- **tsconfig.json**: For configuring Typescript
- **tsconfig.node.json**: For configuring Typescript
- **.eslintrc.js**: For configuring ESLint
### Other
- **.gitignore**: Lists files to be ignored if using Git
- **DEPLOY.md**: Instructions for deployment on an Apache server on Ubuntu.
- **prebuild.sh**: Bash script for automating some steps of deployment.
## Setup Instructions
Note: Running your own version of the client and server should be straightforward,
but generating the database takes a long time.
More details are in `backend/hist_data/README.md`.
### Client Side
1. If you don't have npm or Node.js installed, you can download a Node installer from
<https://nodejs.org/en/download>, which includes npm. This project was coded using version 16.
1. In this directory, run the command `npm install`, which install packages listed in
package.json, creating a `node_modules` directory to hold them.
### Server Side
1. If you don't have Python 3 installed, see <https://www.python.org/downloads>.
The package manager Pip is included.
1. The database used by the server is generated using scripts in `backend/hist_data/`.
See it's README for instructions. You'll likely need to install a few
packages using Pip.
1. To run the data server via `backend/server.py`, you'll need to install jsonpickle.
This can be done using `python -m pip install jsonpickle`.
If you want to keep the installed package separate from your system's packages,
it's common practice to use [venv](https://docs.python.org/3/tutorial/venv.html).
### Running Chrona
1. In `backend/`, run `./server.py`, which starts a basic HTTP server that provides
history data on port 8000.
1. Running `npm run dev` starts the dev server.
1. Open a web browser, and navigate to <http://localhost:5713>.
## Deploying the Website
This is significantly dependent on the server platform. `DEPLOY.md` contains
instructions for deployment on an Apache server on an Ubuntu system.
## Licence
Chrona is licensed under the MIT Licence.
|
