Tutorial – Building a Kanban Style Todo App (code included)

• 31 Mar 2022

What better way to start learning a new technology than with a tutorial that includes all the sample code? When you finish, or fork, the tutorial you will end up with an application like this:

Steven Giesel recently published a 5-part series documenting his experience building a Kanban-style Todo-app using Uno Platform for the first time. Follow along as he takes you through Uno Platform set-up, his thoughts on the platform, and finally a hands-on demonstration of creating a Todo app Kanban-style that runs in your browser, desktop, or mobile!

For those of you who are new to Uno Platform, or looking to start using the platform, it allows for building Mobile, Desktop, and WebAssembly apps with C# and XAML and there has never been a better time to get started. We’ve spent a significant portion of our recent releases (Uno Platform 4.0 and 4.1)  improving performance and features, and the tools now available to you to create amazing apps are paving new opportunities

Part One - Introduction and Environment set up

As a first-time user, Steven gets down to the basics of Uno Platform and covers the differences between the platform and .NET MAUI. With a basic understanding of the platform, part one further provides the fundamentals needed to set up your development environment before laying down the building blocks to start developing a small multi-platform app.

Part Two - Requirements & First Features

The second part of the series focuses mainly on implementing the first features of the application to be able to add your first Todo item. This part of the series begins to showcase the Uno Platform itself and how the code and the requirements are rather simple to get started with.

Part Three - Dialog Component & ViewModel

With the basic construct available, the third part of the series dives into implementing the change needed to allow for user interaction. Secondly, implementing a modal dialog that works on all platforms will permit the user to enter basic information about the Todo item they want to track.

Part Four - Adding Elements to the Swimlane

Part 3 finished with a form that also validates the model. Steven picks up where he left off and begins by creating a ViewModel and laying the groundwork for the next part of our series.

Part Five - Implementing Drag and Drop Behavior

Part 5 covers the final implementations needed to make drag and drop possible and preserve and load the state. Aesthetically, the app is simple but most importantly, we have a fully functional todo app which can be used on all platforms using the same source code base. Finally, Steven wraps up the series with an honest review of his experiencing using Uno Platform.

Thank you, Steven, for your tremendous work showcasing and documenting your Todo App and your contributions to Uno Platform.

Support

If you have questions, feature requests, or issues about using Uno Platform, you can find our engineering team on Discord – Channel #uno-platform. You can also find us on Twitter.

Tags:

Share this post:

Related Posts