- IFTTD allows users to create accounts and link certain donations and charities with Twitter hashtags. We automatically track your donation amount for you, and link you straight to the non-profit's website.
- A notification system will alert you when your hashtag has raised more money.
- A Twitter bot will comment underneath user's tweets with the hashtag of your choice to thank them for their engagement.
There are a couple of things to do before you can start using the AWS Amplify API.
First, cd into the project directory and run this next command.
cd 0.2.1-donation-trigger
amplify init
amplify add api
This will help setup Amplify on your end. Since there's a file called team-provider-info.json
(./amplify/
), you will be able to pull and push changes directly.
Once you have initialized amplify, run the next command to get the most recent version of the API.
amplify pull
Similarly, if you make changes and want to push them to the dev
environemt, run
amplify push
To get the current status of the Amplify project, run
amplify status
To access the Amplify console of the app, run
amplify console
If you want to test the GraphQL api with a mock database, run
amplify mock api
It will generate an instance where you can access a sandbox environment for testing. If you have the mock api running alongside the web app, the app will directly grab from the fake db.
In order to request access to another user's Twitter account via the API, apply for Twitter developer access.
Create a Twitter app, and choose a callback URL to register under that app. If running locally, use ngrok
or another tunneling tool, and register this origin. This URL needs to be within the primary origin.
With that callback URL, set REACT_APP_CALLBACK_URL
in .env
. The user is redirected to this URL, but the window is closed shortly after, satisfying the Twitter API.
Refresh Twitter token and secret, and set REACT_APP_CONSUMER_KEY
and REACT_APP_CONSUMER_SECRET
.
Reminder: Once you update the .env make sure to always restart the react server.
You will need to start the React application, as well as a test env of the API.
npm install
npm start
📂 amplify ├── 📂 .config ├── 📂 backend │ ├── 📂 api │ │ ├── 📂 021donationtrigger │ │ │ ├── 📂 resolvers │ │ │ ├── 📂 stacks 📂 public # Supplemental assets or resources, or static files 📂 src # Source files ├── 📂 assets ├── 📂 components │ ├── 📂 containers │ │ ├── 📂 Action │ │ │ ├── 📂 Greeting │ │ │ ├── 📂 SubmissionComponent │ │ │ │ ├── 📂 AddCharity │ │ │ │ ├── 📂 Charity │ │ ├── 📂 Home │ │ │ ├── 📂 CausesList │ │ │ │ ├── 📂 CausesListItem │ │ │ ├── 📂 EventsLoop │ │ │ ├── 📂 Header │ │ ├── 📂 Legacy ├── 📂 graphql ├── 📂 pages ├── 📂 styles ├── 📂 utils
Big shoutout to the team over at 0.2.1-readme-dirs for creating this generated code structure.
Generate your own project structure here