Flutter WebApp with Wasm & Google Cloud Deployment

Single Page WebApp (SPA) has existed for nearly 2 decades, and it was always been built with JavaScript + HTML + CSS. Meanwhile, WebAssembly has provided another way to build web apps that compile other languages to support web apps.

This presentation walks you through building Flutter WebApps using WebAssembly, with a deep dive into how Dart languages and Garbage collection is used in Flutter to support Wasm, provided with code examples and performance comparison. Then it goes on to provide information on web app deployment on the GCP platform, focusing mostly on Firebase and Cloud Run.

Flutter WebApp with WebAssembly & Desktop

Single Page WebApp (SPA) has existed for nearly 2 decades, and it was always been built with JavaScript + HTML + CSS. Meanwhile, WebAssembly has provided another way to build web apps that compile other languages to support web apps.

This presentation walks you through:
- building Flutter WebApps using WebAssembly, with a deep dive into how Dart languages and Garbage collection are used in Flutter to support Wasm, provided with code examples and performance comparison
- Then it goes on to provide information on desktop applications using Flutter from building to distribution

How AI accelerate front-end development

In this talk, I will give a brief overview of a few keywords in the AI and Machine learning, such as types of AI/ML, GPT, and prompts, which then leads into the conversation of how AI enables engineers to work better, giving a demo of making a front-end application using Bard.

You will experience how AI can assist developers in creating code in a more efficient way. Then it continues on to questions of whether there are any concerns or drawbacks, and how should front-end engineers evolve to accelerate.

Key takeaways:

- Demo the process of creating a front-end project using the power of AI
- Understand how AI can accelerate the project development and release process
- What are the key areas that AI can and cannot provide
- No and Low code platforms and AI-powered IDE tools

DevOps for Frontend

DevOps is always known and common for the backend, but it is for both Frontend and Backend development, as it is a collection of sets of tools to accelerate our daily tasks and transfer everything from manual to automation.

However, DevOps for frontend projects is slightly different from Backend, and here in this talk, I will walk you through details of what DevOps means for frontend developers, and how to create a CI/CD pipeline that contributes to improving productively and releasing cycle.

Key takeaways:

- The different types of CI/CD pipeline
- Project design, architecture, and modularisation
- Decouple services and reduce cycle dependencies
- Tool configuration
- Types of pipelines for integration, release, and deployment
- Application versioning and infrastructure management

DevOps for Frontend & implementation in the Chase UK App

DevOps is always known and common for the backend, but it is for both Frontend and Backend development, as it is a collection of sets of tools to accelerate our daily tasks and transfer everything from manual to automation.

However, DevOps for frontend projects is slightly different from Backend, and here in this talk, I will walk you through details of what DevOps means for frontend developers, and how to create a CI/CD pipeline that contributes to improving productively and releasing cycle in the Chase UK Application.

Key takeaways:

- The different types of CI/CD pipeline
- Chase project design, architecture, and modularisation
- Decouple services and reduce cycle dependencies
- Tool configuration
- Types of pipelines for integration, release, and deployment
- Application versioning and infrastructure management

Accelerate frontend development with Gemini

In this talk, I will give a brief overview of AI and a few key concepts in Machine learning, such as ML types, LLM, NLP, generative AI, and prompts, which then lead into the conversation of how AI helps engineers to work better, giving examples using Google Gemini.

Key takeaways:
- Frontend project ideas with Gemini and Gemma Open Model
- Vertex AI Studio
- No-code and Low-code platforms
- The benefit of using IDX - an AI-powered IDE to accelerate the development process

Building amazing Front-End Project with Gemma: A State-of-the-Art Open Model

In this talk, we'll delve into the exciting world of Gemma, a groundbreaking family of open-source AI models by Google. We'll explore how you can leverage Gemma's capabilities to build innovative front-end projects.
Key takeaway:
• Unveiling Gemma: Understand the core functionalities and architectures of these lightweight, state-of-the-art models
• Benefits and Use Cases: Discover the advantages of using Gemma, including its open-source nature, versatility across tasks, and efficiency
• Implementation in Front-End Projects: explore practical methods for integrating Gemma into your front-end applications, unlocking new possibilities for user interaction and functionality
• Gemma vs. Gemini: shed light on the connection between Gemma and its predecessor, the powerful Gemini model, and explore the distinct characteristics of each model, including size, performance, and optimal use cases.

Join this session to:
• Gain a comprehensive understanding of Gemma open models
• Discover how to leverage Gemma's potential in your front-end projects
• Make informed decisions about choosing between Gemma and Gemini for your specific needs
• This talk is ideal for front-end enthusiasts eager to explore the cutting edge of AI and its applications in user-facing experiences

This talk dives into Google's open-source Gemma models, showing you how to integrate them into your front-end projects.
• Learn about Gemma's capabilities and benefits
• Discover how to use Gemma
• Understand the difference between Gemma and its big brother, Gemini

Google Gemini 101: Unleashing the Power of AI in Your Front-End Projects

Harness the Potential of Large Language Models (LLMs) with Google Gemini! This session provides a comprehensive introduction to Gemini, a powerful AI model from Google. We'll explore how you, as a front-end developer, can leverage its capabilities to build next-generation user interfaces.

Understand Gemini:
• LLMs & Artificial Intelligence (AI): Gain a foundational understanding of Large Language Models and their role within the broader field of Artificial Intelligence.
• Machine Learning (ML) Fundamentals: We'll break down the key concepts of Machine Learning, including training data, model architectures like transformers, and the training and tuning process.

Building with Gemini:
• The Power of Gemini: Discover the capabilities of Gemini, focusing on its ability to generate text, translate languages, and answer your questions in an informative way.
• Unlocking Gemini's Potential: Explore practical methods for integrating Gemini's functionalities into your front-end applications.

Join this session to:
• Gain a solid understanding of Large Language Models and Google Gemini.
• Discover how to use open model to build innovative front-end experiences.
• Explore practical implementation techniques for integrating Gemini into your projects.

This talk explores Google Gemini, a powerful AI model. Learn the basics of Large Language Models (LLMs) and Machine Learning (ML). Discover how Gemini uses transformers for tasks like text generation and translation. See how to integrate open-source AI like Gemini into your front-end projects for innovative features.