Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/gu-stav/coaltransitions

Research and Dialogue on the Future of Coal
https://github.com/gu-stav/coaltransitions

climate-change coal energy gatsby gatsbyjs wordpress

Last synced: about 1 month ago
JSON representation

Research and Dialogue on the Future of Coal

Awesome Lists containing this project

README

        

Frontend for [coaltransitions.org](https://coaltransitions.org) build with
Gatsby. The data is fetched from a [wordpress backend](https://github.com/zoff-kollektiv/coaltransitions-cms).

## Structure

- `gatsby-config.js`: Contains the site title, the header and footer menu aswell
as the information which is used to fetch tweets from twitter
- `netlify.toml`: Contains the legacy redirects from the old site
- `src/pages`: All pages which don't have any parameters (frontpage, overviews ...)
- `src/templates`: Pages which have input parameters (finding, publication ...)
- `src/lib`: Helper functions, for page creation aswell as publication filtering
- `src/components`: All components which are used in pages and templates to render
the pages. Components are reusable chunks of code.
- `src/tokens.js`: Variables for colors, mediaqueries and fonts

### Tweets

Tweets are embedded from the coaltransitions twitter account. `./functions/twitter-timeline.js`
functions as a proxy, for authentication and data fetching. The function
is deployed as an AWS Lambda function by netlify.

#### Environment variables

```
WP_ENDPOINT: Wordpress Graphql endpoint
WP_AUTH_USERNAME: Wordpress Basic auth username
WP_AUTH_PASSWORd: Wordpress Basic auth password

// to show recent tweets on the homepage you'll also need

TWITTER_CONSUMER_KEY: Twitter consumer key
TWITTER_CONSUMER_SECRET: Twitter consumer secret
TWITTER_ACCESS_TOKEN: Twitter access token
TWITTER_ACCESS_TOKEN_SECRET: Twitter access token secret
```

### Build status

[![Netlify Status](https://api.netlify.com/api/v1/badges/f051ac1e-f9b0-424a-9477-dd9bdef6e833/deploy-status)](https://app.netlify.com/sites/coaltransitions/deploys)

## Development

First you need to install the project dependencies by running

`npm run install`

Now create a copy of the `.env.example` file and fill in the environment
variables. You should be able to start the development now by running:

`npm run develop`

This should give you access to [localhost:8000](http://localhost:8000) where
you can access the development build of the site, with production data.

### Functions

To fetch the data from the twitter account you also have to boot up the lamda
development environment (check the required environment variables mentioned
above):

`npm run serve-functions`

Afterwards you should be able to access [localhost:9000](http://localhost:9000).

Gatsby automatically proxies the required requests to the functions server. No
additional setup is required.

The twitter search parameters can be found in `gatsby-config.js`.

## Production build

By running `npm run build` gatsby creates a static version of the site in
`./public`.