simonmitchell / CovidCommunitySite

A site for showing community resources during the Covid-19 Community Outbreak

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Covid-19 Resources

This project is a simple template to setup a website listing local resources available within a community. I felt this was particularly important now that local communities and councils are seeing massive changes to how businesses are running, and how locals are getting access to food and other things due to the 2020 Covid-19 outbreak. It was built as low-fi as possible, so there is no API for data – it is simply hard-coded in a set of files which will be outlined below.

The website consists of one main page, which allows users to filter by area and then search or browse a list of resources which are available in their area. There is a secondary page for users to create data for their business in the format required so the maintainer isn't inundated with having to edit JSON files constantly!

This website is build using React.js, but only a very basic understanding of this is needed, as no real tweaks are necessary to deploy for your usage.

Getting Started

This website requires Node in order to run. There are two ways of achieving this with your local setup.

Once you have carried out either of the below methods, you can visit http://localhost:3000 in your web browser to view the site.

Any changes will be re-compiled whenever a file is saved, and your browser should display these automatically via "hot reload".

Using Node on your host machine

Requirements

  • NodeJS / nvm
  • Built and tested using v10.15.0

To get started you will then need to run:

npm install
npm run start

Using Docker Compose

Requirements

To get started you will then need to run:

docker-compose up

Customising

Adding regions

Regions (Used to split data within a county for example) need to be added to src/constants/regions.json. The example structure can be seen in the existing file.

Adding new locales

New locales need to be added to src/constants/locales.json. The example structure can be seen within the existing file in this repo.

Adding new categories

New categories and sub-categories can be added to the src/constants/categories.js and src/constants/subCategories.js files respectively. These are simply an array of strings. Localisations will need to be added for any new categories or sub-categories in the src/index.js.

Adding new resources

Resources can be added to the src/constants/resources.json file. In there you will see an example of a resource localised into english and welsh (Although the welsh locale isn't currently setup in the template project). Most properties in the resource are localisable, except for where it doesn't make sense like for urls, contact details, or people's names.

How each property is displayed in the UI is best visualised by visiting the /submit path of the website!

Hosting

Please edit the CNAME file in public/CNAME to point at your domain name

GitHub Pages

I host my version of the website using GitHub pages, if you run npm run deploy this is setup to automatically deploy to a gh-pages branch.

IMPORTANT If you are hosting on gh-pages make sure to change the homepage in package.json to point at the domain for your site.

Information on how to setup GitHub pages to use a custom domain can be found here

Other Options

There are many other options out there for free hosting, I have been suggested by colleagues to use netlify which apparently is basically drag-and-drop!

Pull Requests

I am a mobile developer by trade, not a frontend developer but have a lot of experience with React Native which has given me enough knowledge to build this. For that reason I would actively encourage pull requests, as there are probably a lot of pitfalls I have made developing this site!

About

A site for showing community resources during the Covid-19 Community Outbreak


Languages

Language:JavaScript 87.4%Language:HTML 10.5%Language:CSS 2.1%