Sign up for an account and enter your dashboard. \
\
Select the **App** option.
Zoom Saved
Select '**Blank template**'.
Zoom Saved
Follow the instructions to add an emoji, name and ID for your project.\
\
You can call this 'news app'.
Zoom Saved
Click "**Create project**"
Zoom Saved
If you're using Toddle for the first time, you'll be shown a series of onboarding instructions.\
\
Click '**Next**'.
Zoom Saved
Read this information and then click '**Next**'.
Zoom Saved
Read this information and then click '**Next**'.
Zoom Saved
Read this information and then click '**Done**'.
Zoom Saved
The blank Toddle template that's created only uses a few blank elements. One of them is a paragraph element that you won't need for this lesson. \
\
Delete the paragraph element by right-clicking it to bring up a sub-menu.
Zoom Saved
Click "**Delete ⌫**"
Zoom Saved
Select the '**h1**' element and then under '**Styling**' select '**Absolute**' to move this element to the top of the page.
Zoom Saved
You should now have something that looks like this.
Zoom Saved
The first thing you're going to do for your news app is to configure the source of data. In this example you'll use a free news API from newsdata.io.\
\
Head to <https://newsdata.io/> and click '**Get API Key**'.\
\
Follow the instructions to sign-up for an account. Be sure to confirm your email address.
Zoom Saved
From the homepage, select '**Free News API**'.
Zoom Saved
Copy the URL you see for one of the example news requests that's listed.
Zoom Saved
Navigate back to Toddle and click + to add a new API.
Zoom Saved
In the API field name, add '**News**'.\
\
Copy and paste the URL from newsdata.io into the URL field as shown below.\
\
You'll see the rest of the API fields in this section populate with information that it's pulling from the API.
Zoom Saved
Now that your API is connected, you're going to take the information from the API and choose how to present this information using Toddle's predefined elements.\
\
Click back into your editor and select the + icon next to '**Homepage**'.
Zoom Saved
Select '**Snippets**' > '**Card**'. \
\
This will add one card item to your app (this card will later show data from a news item).
Zoom Saved
This Scribe is in tip-top shape!Leave feedback if there are any issues with this Scribe
Have something to say?Create an account to leave messages for the author to see!
Press space bar to start a drag.
When dragging you can use the arrow keys to move the item around and escape to cancel.
Some screen readers may require you to be in focus mode or to use your pass through key