Visit the site here!
Local Memory is an interactive online visualization to explore the distribution of local news organizations across the United States. It is a React website written in TypeScript built with Vite. Packages and dependencies are managed with npm. In order to develop and deploy Local Memory you will need to have installed npm on your system.
This website was built using React + TypeScript + Vite. The map uses D3 with geoJSON data.
To develop the project locally first ensure you have an up-to-date version of npm installed.
Clone the website locally with:
git clone https://code.wm.edu/data-science/news-lab/local-memoryAfter cloning the repository, from the top-level directory of the website run:
npm install
npm run devThe website is then accessible at http://localhost:5173/.
On the top level of the project are all the configuration files related to Vite, TypeScript, the package.json, and utilities related to linting and formatting. The src folder contains the contents of the React app.
The main file of the React app is index.tsx, which contains the contexts for persistent data, URL routing, responsive styling, and the application itself. App.tsx contains the actual routing (done with react-router-dom).
For the frontend, linting is done with ESLint while code formatting is done with Prettier and Stylelint. The setup uses phantom-config for the base configuration. Linting and formatting can be triggered by executing npm run format.
This repository uses semantic versioning to track changes. To update the version use npm version followed be either patch, minor, or major accordingly.
Deploying the website utilizes both Docker and nginx. nginx is used for serving/proxying the files. To build a production version of the website locally using Docker perform:
docker-compose up --buildThis will build and run the website on port 80 locally.
The production release of this website is hosted through W&M IT. Deployment is done using a GitHub Action that is automatically invoked upon the main branch being updated.