What: Add Netlify logo to the footer

Why: Netlify added changed our billing plan to the Open Source one. In return, we have to add the logo somewhere in our website

How:

• Add Netlify logo to the footer. Logo can be found here https://www.netlify.com/press/#badges

What: Add Google Analytics

Why: To have data about our visitors

How:

We can either integrate this using the Google Analytics snippet or by integrating Google Tag Manager

Use the following screenshot as a base to develop a UI that allows a user to see the actions for a current campaign.

The expected modifications within the UI are that the "GO" button is not going to be there but instead the user click the action row and a descriptions will be expanded (markdown rich) with a link that on click will mark the action as completed.

In further iterations we can work with Twitter or Facebook API to support more complex actions

Acceptance Criteria

• Make sure to have a service to work with
• Create a basic UI to display actions
• Integrate actions UI with campaign service
• Fix deployment issue with Apollo
• Have a PR with the actions listing in a isolated page

What:

Why:

How:

What: Research Netlify CMS integration

Why: To allow our admins to change all text in the campaign app

How:

• Research Netlify documentation
• Build a prototype and define a spec

Let's use BrowserStack for this

What: Implement Notification Banner

How:

• Implement as a React component
• Connect fields to the CMS

Add correct support of preview templates within the CMS.

Current:

Expected:
We should be able to render the page as it would be rendered with the content

What: Integrate Login and Signup with SSO

Why: All of our services use SSO at the moment, we want this to be possible in this app too. We will need to integrate permissions also, so users that belong to a specific group will have admin access in this application.

How: We have some reference implementation in Node.js that we can use here too, this is in the dispute-tools repo. The flow should be the same.

Acceptance Criteria:

• User should be able to trigger a login flow from the website
• User should be able to trigger a signup flow from the website
• User should be able to trigger a logout from the website
• User should be able to see its session through all ours platforms

re #24
re #23

Note: to being able to properly use the SSO implementation we have the service https://github.com/debtcollective/campaign-api needs to be updated to use the session cookie

What: Fix react-boostrap warnings displayed when running the server locally

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.
         on line 8 of node_modules/bootstrap/scss/mixins/_deprecate.scss, in mixin `deprecate`
         from line 15 of node_modules/bootstrap/scss/mixins/_background-variant.scss, in mixin `bg-variant`
         from line 2 of src/styles/functions.scss
         from line 74 of stdin

WARNING: The `bg-variant` mixin has been deprecated as of v4.4.0. It will be removed entirely in v5.

Why: To have the server run without warnings

How: If it's not possible to fix the warnings by upgrading the package, we should open an issue on the corresponding library repo.

What: Implement Demands section

According to designs implement the Demands section.

How:

• Implement as a React Component
• Connect fields to the CMS

What is the expected behaviour?
We will use the date without the time

What: Research CMS Implementation

Why: We need a CMS for the campaign page, this to allow admins to change the text without needing a developer.

How: Research the different options and evaluate them. Write a small spec about this and let's discuss it with the rest of the team to settle on a solution.

Notes

After we decide what CMS we will use, we will create more tickets to cover implementation

What: Implement Hero section

According to designs implement the Hero Section.

How:

• Implement as a React Component
• Connect fields to the CMS

What: User should be able to complete the Data Dues action

Why: We want to improve our data, in both quality and quantity. This is part of an effort to better understand how debt and its effects.

How:

• User will be presented with a link to start the action
• User will be presented with a form with validation using JSON schema. The form will have the following fields https://docs.google.com/document/d/101ttsJrp9uT9yqNDDrd6ec9kwpvUp1ivcBpzvLCICqM
• Once the user completes the step, we will mark the action as completed in their profile

A logged user should be able to trigger the logout action once it is logged in. check comment debtcollective/student-debt-campaign-netlify#23 (comment) to know more about recommended approach

This is related to #3

Acceptance Criteria

• User should be able to trigger logout action from the campaign site

What: Deploy campaign-api to AWS

Why: To have it running with the rest of our services

How:

• Create terraform scripts in the infra repo and run them. Make the service is working and it's reachable.

What:
FAQ content is not rendering links properly

What: Page has SEO tags and previews had been tested correctly

SEO tags should be included in every page, as well as open graph tags. We need to test previews in major social media platforms and make sure these look good.

https://www.gatsbyjs.org/docs/add-seo-component/

How:
We would like to have this in the CMS too, so admins can change it without developer intervention. We can use the same SEO information as this landing page http://strikestudentdebt.org

• Integrate SEO with Gatsby
• Test previews on Open Graphs and add the required tags, including images.

What: Integrate Header

We will be integrating the header component https://github.com/debtcollective/header, but we will template it so it looks like designs. Functionality wise it will stay the same.

How:

• Integrate Header component
• The session should work correctly with Discourse

What: Research Actions

Why: Actions is our way to enable users to spread the word of our campaign. Actions will look like this:

• Follow The Debt Collective on Twitter
• Follow Strike Student Debt on Facebook
• Retweet a specific Tweet

The list of actions is TBD, but every action needs to have:

1. Something actionable the user needs to do.
2. A way for us to verify the user did what it was meant to do.
3. Reward the user.

How: The research show include:

• Define how we will implement actions (messages and interfaces)
• Define how we will store data for actions. Consider that If the deployment is done outside AWS, we won't be able to access RDS (Postgres) databases from outside
• Define how we will be doing the deployment of this app.
• Define how we will consume SSO from Discourse. The fundraising app has this implemented already.

The app doesn't need to be tighed to Netlify, we can use Netlify to host the CMS app of the campaign website, and deploy a small GraphQL API in AWS to do data persistence.

What:
Add support for buttons on the hero section to being able to share the website.

Acceptance Criteria

• Share on Twitter
• Share on Facebook
• Share on LinkedIn Optional

re #21

What: Implement CTA section

According to designs implement the CTA section

How:

• Implement as a React Component
• Connect fields to the CMS

What:
We need to include the new voices/profile into the join campaign section

Resources:
The latest content we need to include is here

What:
We need to store the relation between a user and a specific campaign

• re #17
• re #18
• re #19

What: Implement website as designs

Why: Design uses our current style guide, by doing this we will have our app to look like the rest of our platform

How: Designs are currently hosted in Notion, we will migrate this to Figma when we get the final designs. For now we can implement from Notion.

Ask for the link developers and please don't post it here since is not meant to be public yet

• Setup the project
• Minimal raw skeleton
• Hero section
• Notification banner "We are winning"
• Informative section
• Massive call-to-action section
• Rich informative section (it has "testimonies" and "call-to-action")
• FAQs section
• Sidebar control (one page scroll index) re #10
• One page scroll feature #10
• Header integration (one of our headers) re #12

This is related to the feedback that has been made at debtcollective/student-debt-campaign-netlify#15 (comment) ideally we should not track the changes after an update ourselves.

https://www.apollographql.com/docs/react/data/mutations/#updating-the-cache-after-a-mutation

We will unlock some features in the Community when a user joins a campaign. We have access to the community but we would need a way to communicate Discourse that a subscription has changed.

We will create a plugin that gives the user

• Badges for joining a campaign
• Add user to a specific group when they join a specific campaign

What: Implement One Page scroll on Desktop

How:

• Research a library that implements this behavior
• Use that library to implement one-page scroll
• This should only work on Desktop

Acceptance Criteria:

• As a developer I should be able to create PRs that affect the staging environment only

What: Connect Our Voices in each Join Campaign section to the CMS

This section features profiles from current strikers. Each strike will come from the strike status they choose. We can implement these by connecting both the images and text to the CMS and have a way to create these as an Array.

How:

• Implement as a React Component
• Connect fields to the CMS
• Admin should be able to create multiple profiles of strikers per section

Acceptance Criteria:

• User should be able to see actions to spread the word on /actions page
• User should be able to complete actions to spread the word on /actions page
• User should be able to access to /actions page only when is logged in
• User should be able to see only the actions that belong to him

Note: we currently only support actions of type LINK, besides, the full development of this feature needs updates within the service develop at https://github.com/debtcollective/campaign-api

What: Implement FAQ section

According to designs implement the FAQ section

How:

• Implement as a React Component
• Connect fields to the CMS

What: Implement Join Campaign sections

According to designs implement the Join Campaign sections

How:

• Implement as a React Component
• Connect fields to the CMS