Building a web-based app

You are here: Home » MiltonMarketing Blog » Computer Programming Languages » Web App » To-do-list app » Building a web-based app

Building a web-based app

HOW TO BUILD A BUTTON

Let’s start making the app by building a button. Use < input/ > tags to code a text box and button.

1) Open up your text-editing program. Create a new HTML file called app.html. Type this code into your new file:

<!DOCTYPE html>
<html>
<head>
 <title>To-Do List App</title>
</head>
<body>
 <p>Hello World! To-do list.</p>
 <br/>
 <br/>
 <br/>
</body>
</html>

2) Now use the < input/ > tag to create a text box and button in your. Don’t forget that you need to include two attributes inside your < input/ > tags: the type and value attributes.

You should set the value attribute to the text you want to display in your box and button. Your code will look like this:

<body>
 <p>Hello World To-Do List</p>
 <br/>
 <input type="text" value="Type here to add task"/>
 <br/>
 <input type="button" value="Add item"/>
 <br/>
</body>

3) Save your HTML file and open it in your browser. You will see your box and button displayed on-screen.

Now create a CSS class and use the CSS type attribute selector to change the colour of your button.

About the Author:

I am a loving father, & husband. I am a computer enthusiast. I have used and enjoyed computers since I was young and I enjoy teaching young minds how to code, because it teaches them how to think. Today with YouTube, and social media garbage our youth are losing the ability to think on their own and solve problems. I believe this is a serious epidemic as kids today dont understand that technology is a tool. This tool is being abused, and its underlying effects are taking its toll on kids behaviour, and learning.