How to create a News App using Toddle

In today’s lesson you’re going to create a news app using no-code app builder toddle.

How to create a News App using Toddle
Do not index
Do not index
In today’s lesson you’re going to create a news app using no-code app builder toddle.
Let’s build 👩‍💻

Task for the Day 📝

🧱 Project: Build a News App
⏲️ Estimated time: 30 minutes
🛠️ Tools: toddle
 

Context Building 🏔

In today’s lesson you’re going to get hands-on with no-code app builder toddle.
When building apps like the one you’re going to be building today, you’ll often be switching between configuration of the front end (the graphical interface - what users see) and the back end (the technical environment and integrations that drive your app functionality).
Watch this video to help you understand the difference between front end and back end development.
In this lesson, you’ll use toddle to configure both the front end and back end of a news app, all without programming any code!
First, you’ll customise the front end of your app, which will feature news items including images, titles and descriptions.
You’ll then configure the back end of the app by connecting toddle with a free news API from newsdata.io.
Finally, you’ll configure a search function that will allow users to search your news app by keyword.
In this lesson you’ll learn:
  • How to customise the front end of an app in toddle using elements
  • How to connect APIs in toddle
  • How to configure a search function in toddle using an input element

Let's Prep 🥗

What’s toddle?
Web app mastery without the need for a keyboard! Craft potent web applications and bid farewell to tedious handovers and vexing syntax errors. Unleash your creativity and design apps easily and unleash your limitless potential.
Forget traditional hurdles like code—toddle offers the flexibility, speed, and tools of custom code without the hassle.
  • Collaborate with Git-style branching and version control for smooth teamwork and efficient development cycles
  • Access a treasure trove of pre-built packages that saves you time and effort as you expand your toolkit exponentially.
  • Get lightning-fast load speeds with a state-of-the-art AAA framework that ensures your apps perform optimally, regardless of scale
  • Complete control of SEO with limitless options to make your site readable and dynamically updated for the crawlers that matter to you
 
10% Off Offer
You can complete today’s lesson using toddle’s free plan and a free API from newsdata.io.
However, if you enjoy toddle and want to use their paid plans, they’ve kindly gifted 100 School students 10% off your first billing period if you use the code 100SCHOOL when upgrading.
 
🔥 Get ready to build!
To make your life easier when you build, it’s good to get some practical stuff out the way first. Follow these steps so you’re ready to build:
  • Sign up for your account with toddle
  • Sign up for an account with newsdata.io and confirm your email

Time to Cook 👩‍🍳

Follow the steps below to build:
  1. Read through today’s lesson and watch the video to help understand the difference between front end and back end development.
  1. Follow this step-by-step guide to complete today’s lesson.
 
That’s a wrap, we hope you found this lesson helpful!
  • If you have any questions, feel free to reach out.

The easiest way to learn practical tech skills in 100 days.

Join other 40,231+ learners now!

Subscribe

Written by

Max Haining
Max Haining

Founder of 100School.com