Web-based report built using D3.js for data visualizations, and the Svelte framework.
-
Install the following softwares,
-
Open a terminal and run the following command to clone this repository on your machine,
git clone https://github.com/nditech/gendered-disinfo-web-report.git
-
With the cloned repository as your current working directory, install the dependencies by running the command,
npm i
-
Edit the parameters of the report in the config file
-
Build the report by running the command,
npm run build
-
Launch a web server serving the report by running the command,
npm start
-
Open your browser and enter the following URL in the address bar to see the report,
localhost:5555
Here are the instructions to host the website inside an AWS S3 bucket.
-
Go to your AWS S3 console
-
Click on "Create bucket", set the name and region, and make sure "Block all public access" is unchecked. Then, click on "Create Bucket".
-
Click on your bucket and then click on the "Permissions" tab
-
Edit "Bucket policy" and paste the following policy while making sure to replace {bucket_name} with the name of your bucket:
{ "Version": "2012-10-17", "Statement": [ { "Sid": "PublicRead", "Effect": "Allow", "Principal": "*", "Action": "s3:GetObject", "Resource": "arn:aws:s3:::{bucket_name}/*" } ] }
-
Click on "Save changes"
-
Click on the "Objects" tab and then click on "Upload"
-
Drag and drop all the content from the public folder of this repo and then click on "Upload"
-
Click on the "Properties" tab and scroll down to the "Static website hosting" section. Click on "Edit"
-
Enable Static website hosting, and set "index.html" as the Index document. Click on "Save changes"
-
Make sure everything works by clicking on the Bucket website endpoint
-
Go to your AWS S3 console
-
Click on your bucket
-
Click on the "Objects" tab and then click on "Upload"
-
Drag and drop all the content from the public folder of this repo and then click on "Upload"
To monitor the viewership of the website you can add a Google Analytcs tracker.
-
Create a Google Analytics account
-
On the "Admin" page, navigate to "Data Streams" and select "Web"
-
Create a new stream using the URL of your website
-
Copy the "MEASUREMENT ID" and paste it into the config file,
"GOOGLE_ANALYTICS_ID": "G-005X6Y4G5M"
-
Rebuild the report,
npm run build
Viewers might want to reach out by email. They can encrypt their message using the PGP public key displayed at the bottom of the page.
Many tools are available to generate a new public/private key pair, encrypt a message using the public key, and decrypt the message using the private key.
For testing purposes, you can use the online pgptool.
Save the public key inside the files subdirectory of the public folder.
To serve your website through Tor, you will need your own linux server.
-
Install Tor,
sudo apt update sudo apt install tor
-
Uncomment these two lines in the config file /etc/tor/torrc
HiddenServiceDir /var/lib/tor/hidden_service/ HiddenServicePort 80 127.0.0.1:80
-
Get the Onion address of your server by running
sudo cat /var/lib/tor/hidden_service/hostname
-
You should get something that looks like,
en5kq3sxdasdabd212aoisdtrsblbaznpk4ljqd.onion
-
In the config file set ENABLE to true and paste your address,
"TOR": { "ENABLE": false, "ONION_ADDRESS": "http://ADDR.onion" },
-
Rebuild the report,
npm run build