app

DevClub Summer of Code 2023

App Development

Why learn this?

1. Engagement: People are more likely to be engaged when they have an app installed on their device. Having an app icon visible on the home screen serves as a constant reminder of your brand or service. Additionally, push notifications can be utilized to send timely and personalized updates, prompting users to interact with the app more frequently.

2. Access to Device Features: Apps have direct access to a device's hardware and software features, which allows for more extensive and seamless integration. This enables developers to create innovative functionalities and experiences that go beyond the capabilities of web-based applications. Whether it's utilizing the camera, geolocation features, or using biometric authentication methods, apps offer greater access to device features.

3. Enhanced Security: Apps can benefit from the built-in security mechanisms and features provided by the operating system. These include permissions management, secure storage, and encryption options. By utilizing these native security measures, developers can ensure the protection of user data and mitigate potential security risks.

4. Personalization: Apps allow for greater personalization options based on user preferences, behavior, and location. By collecting and analyzing user data, apps can provide personalized content, recommendations, and user interfaces tailored to individual preferences.

Why Flutter?

1. Single Codebase: Flutter's ability to create apps for multiple platforms ensures broader market reach and compatibility. By building a single codebase, developers can simultaneously target Android, iOS, web, desktop, and more, reaching a wider audience.

2. Developer Experience: Flutter offers an extensive library of pre-designed and customizable widgets. These ready-to-use widgets simplify development and reduce effort and time of developers. With the flexibility and customizability offered by Flutter, developers have the freedom to design and fine-tune their app's appearance and behavior according to their specific requirements. This level of control and adaptability empowers developers to create beautiful and unique user experiences, elevating the quality of their apps.

3. Developer Support: Flutter provides robust developer support through its active presence on platforms like GitHub, Discord, and various online communities. Developers can seek assistance, share ideas, and collaborate with fellow Flutter enthusiasts. Moreover, Flutter's ease of developing new packages and plugins encourages innovation, allowing developers to extend the platform's functionality effortlessly.

4. Beauty of Dart and Google Prioritization: This makes flutter an appealing choice for app developers. With its clean syntax and modern features, Dart enables efficient development and code maintenance. Google's support, exemplified by frameworks like Flutter, fosters a vibrant ecosystem, providing resources and cross-platform capabilities. This combination empowers developers to create high-quality apps with elegance and productivity.

Week 1

• Concepts

1. Setting up Flutter and Visual Studio Code (VSCode): Start by installing Flutter and setting up Visual Studio Code on your local PC. This will ensure a seamless Flutter app development experience. Additionally, we will introduce you to essential VSCode extensions specifically tailored for Flutter development, enhancing your coding experience.

2. Widgets: Stateless and Stateful: Learn about the concepts of stateless and stateful widgets, which are the building blocks of Flutter UIs. Understand the differences between them and when to use each. Create visually appealing layouts using widgets such as Column, Row, Scaffold, Container, and others.

3. Lists and Grids: Explore working with lists and grids to manage dynamic data. Learn how to create scrollable lists and grids using Flutter widgets, improving the organization and efficiency of displaying and interacting with data in your app.

4. Form and Validation: Forms play a vital role in capturing user input. We will cover the process of building forms in Flutter, including form validation techniques to ensure accurate data submission. You will learn how to create input fields, validate user input, and provide real-time feedback.

5. Introduction to pub.dev: Discover pub.dev, a central repository for Flutter packages. Learn how to search, evaluate, and integrate packages into your Flutter projects. Find ready-to-use components and utilities that can enhance your app's functionality.

• Resources

• Why the Future of Flutter is Bright in 2023 and Beyond

• What is State?

• The difference between stateless and stateful widgets in Flutter

• Flutter “Must Know” Basic Widgets

• Lists and Grids (RecyclerViews in Flutter)

• pub.dev - Flutter Packages

• Flutter Documentation

• Task

This assignment will allow you to apply your Flutter skills with Marketplace Design Exploration, Product Listing Implementation, Product Details and Interaction, and Cart Functionality.

Week 2

• Concepts

1. Custom Widgets: Take the initiative to create custom widgets that align with the design and functionality of our marketplace app. These widgets should encapsulate specific UI components or reusable elements, promoting code reusability and modularity. Experiment with different Flutter widget types such as Container, Card, FlatButton, or CustomPaint and customize them according to the desired visual style and behavior of our app.

2. PageView Builder: Implement a dynamic PageView builder that enables users to swipe between different banners displayed in our app. Utilize the PageView widget to showcase promoted banners with smooth transitions. Apply the builder pattern to dynamically generate the content of each page, ensuring flexibility in our user interface.

3. Forms and Input Validation: Take the initiative to implement forms that capture user input and perform input validation. Focus on creating a form that allows users to provide necessary details when posting a product for sale. Utilize Flutter's form widgets, such as TextFormField and FormFieldValidator, to manage user input and maintain data integrity. Implement validation logic to verify the correctness of entered data, including checking for required fields and enforcing length limitations.

• Resources

• Building an eCommerce app with Flutter

• Flutter – Custom Widgets

• Designing a Form Submission Page in Flutter

• Flutter form validation: The complete guide

• A Deep Dive Into PageView In Flutter (With Custom Transitions)

• Task

Dive deeper into Flutter's Widgets by building ProductTile, Promoted product banners and implementing forms. Make the app dynamic and interactive!

Week 3

• Concepts

1. Integrating RESTAPIs (GET, POST, PUT, DELETE): Throughout the week, your task will be to explore and implement the fundamental concepts of REST API integration. You will learn how to make HTTP requests using the various methods such as GET, POST, PUT, and DELETE to interact with server resources. Your challenge will be to understand endpoints, request headers, request bodies, and how to handle server responses. By the end of the week, you will have the skills to effectively communicate with server-side resources, retrieve and create data, update existing resources, and delete resources using the appropriate HTTP methods.

2. JSON Serialization and DeSerialization: You have to learn how to serialize Dart objects into JSON format and deserialize JSON into Dart objects. This process will enable you to seamlessly communicate with server APIs, persist data, and share information within your app. Your challenge is to transform data between JSON and Dart objects, allowing for efficient data handling and manipulation.

• Resources

• Fetch data from the internet

• Working with REST APIs

• Flutter Tutorial - HTTP Requests and REST API (GET, POST, PUT and DELETE)

• JSON and serialization

• Task

In Week 3, We communicate with server resources, manage product data using HTTP methods. Enhancing our app's capabilities for seamless product management and smooth data handling.

Week 4

• Concepts

1. Introduction to Google Firebase : Explore the powerful features of Google Firebase and its significance in building robust mobile and web applications. Your have to understand its various components and their benefits for app development. Think about the different use cases of Firebase's real-time database, cloud storage, user authentication, hosting, and other services.

2. Authentication : Firebase offers different authentication methods, such as email/password, Google, and Facebook authentication. Learn how to implement Firebase Authentication. Understand the significance of secure user authentication and how it improves the functionality and user experience of apps.

3. Cloud Storage : Learn how to integrate Firebase Storage for securely store and retrieve images. Explore techniques for efficiently managing storage, such as compressing images to optimize performance and reduce storage costs.

4. Stripe Integration (BONUS) : Explore Stripe payment gateway, its features, and the steps involved in integrating it into flutter app. Learn how to set up Stripe, securely handle payment requests, and ensure reliable transaction processing.

• Resources

• Code for the Backend server

• Add Firebase to your Flutter app

• Firebase Setup [2022] Easy and Quick Firebase Setup!

• Add Firebase Authentication to your app

• Flutter Firebase Auth - The Cleanest & Fastest Way - IOS & Android

• Upload files with Cloud Storage on Flutter

• Flutter File Upload - Pick, Crop, and Save Images to the Cloud

• Exploring the Stripe Flutter SDK

• Flutter Stripe - How to Enable Stripe Payments in your Flutter Apps [2022]

• Task

Implement Firebase user authentication, integrate cloud storage for image handling and explore Stripe for seamless payments.