Code Monkey home page Code Monkey logo

readme_updated's Introduction

Roaa's Welcome Message
Roaa's profile views

Software Engineer and Google Developer Expert for Flutter & Dart, passionate about animation, content creation, open source, and speaking at tech events. Currently a Senior Flutter Developer at Widgetbook working on an open source product that aims to make Flutter developer’s life easier and changes the way designers and developers collaborate.

I started getting involved with the vibrant Flutter Community in late 2021 by sharing Flutter tips on Twitter. And since then I’ve written multiple articles, participated and won in the Flutter Puzzle Hack challenge, built and contributed to open-source projects, and spoken in online and in-person tech events.


Roaa's Github Stats Roaa's GitHub Streaks

Open Source Flutter Projects

Project Links
Dashtronaut Slide Puzzle winning in the Flutter Puzzle Hack for Best educational content

Dashtronaut - Slide Puzzle Game

πŸŽ₯ Watch Demo Video

A slide puzzle game built with Flutter for the Flutter Puzzle Hack Challenge. It's set out in space with Dashtronaut, Dash the Astronaut, floating in space and interacting with the user.

πŸŽ‰ 🎊 The submission won a prize for Best Educational Content!

πŸ“ƒ You can read the full development story & inspiration here

πŸ”— Launch Web App

Dashtronaut on Google Play
Dashtronaut on iOS App Store
Dashtronaut on Mac App Store

Source code

Movies App

A Flutter app that uses the "The Movie DB" API to fetch popular people and their info (their movies, images, ..etc)

The goal of this project is to be a full app example for using Riverpod as a comprehensive solution for state management, caching, and other capabilities and implementing clean architecture with full test coverage with unit and widget tests. You can read detailed information in the README.

πŸ”— The Movie DB API
πŸ“¦ Caching
πŸ“ƒ Infinite-scroll/Pagination
πŸ§ͺ Unit & widget tests! (100% coverage! πŸš€)

This app is also available as a 3rd party example in the official Riverpod Docs


Animation and UI Challenges

Toolbar Card Swiper 3D Calculator
Toolbar with Flutter Card Swiper with Flutter 3D Calculator with Flutter
Flutter Cool Toolbar Flutter Cool Card Swiper Flutter 3D Calculator
πŸ”— Tweet πŸ”— Tweet πŸ”— Tweet

Client Projects And Apps on The Stores

Project Links

Manarati

Ad-free Muslim prayer times app built with Flutter. I worked on this app as a Flutter Developer Team Lead at Multicaret

πŸ—“ March 2022 - June 2022 (~4 months)

πŸ”— Website

FSN - Future Syrian Network

Telecommunication app built with Flutter. I worked on this app as a Developer Team Lead at Multicaret

πŸ—“ March 2022 - May 2022 (~3 months)

πŸ”— Website

Klinika

Medical app built with Flutter. I worked on this app as a Mobile Developer Team Lead at Multicaret

πŸ—“ May 2021 - February 2022 (~1 year)

πŸ”— Website

TipTop

Grocery shopping and food delivery app built with Flutter. I worked on this app as a Mobile Developer Team Lead at Multicaret

πŸ—“ March 2021 - July 2021 (~7 months)

πŸ”— Website

Flutter Talks

In-Person at Flutter Vikings in Oslo, Norway - Take Your Flutter Animations to The Next Level

πŸ—“ August 31st, 2022

πŸŽ₯ Talk Video
πŸ“‘ Slides
πŸ“ƒ Article
πŸ”— Live Demo
Out of the box, Flutter provides you with tools to create truly beautiful animations! And I want to tell you how you can use those tools, as well as the surrounding ecosystem, to take those animations to the next level! I’m not only talking about 3rd party package or frameworks like Rive and Lottie, most importantly, I’m talking about how you can utilize those same out-of-the box tools and features, while making use of the host device & platform with everything they offer and Flutter easily allows you to access, like various touch, tap & scroll gestures, mouse movement, sensor data, ..etc, to create cross-platform, highly interactive, truly next-level animations that make your users go: Wow, can an app do that?

Code in the talk can be found in this repository:
Flutter Festival Session - Flutter Animations
Flutter Festival Silicon Valley - Dashtronaut App Showcase

πŸ—“ March 23rd, 2022

πŸŽ₯ Talk Video
Deep dive into Dashtronaut, my slide puzzle game submission to the Flutter Puzzle Hack challenge. I talked about:
  • App architecture & Folder structure
  • Animated CustomPainter
  • Responsiveness & Cross platform capabilities
  • Slide Puzzle logic
  • Animations with built-in Flutter widgets & 3rd party tool (Rive)
  • Haptic Feedback
  • Hive for local storage
  • Performance Optimizations - Skia Shader (SkSL) warm up & Pre-caching images
Flutter Festival Valsad & Surat - Flutter Animations

πŸ—“ March 26th, 2022

πŸŽ₯ Talk Video
Comprehensive guide of Flutter animations with multiple examples & use cases.
  • Quickest & Easiest approach: Implicit animations (no AnimationController)
    1. Built-in animation widgets (AnimatedContainer, AnimatedOpacity, ..etc)
    2. Custom animation widgets with TweenAnimationBuilder
  • Explicit animations: using AnimationController
    1. Built-in widgets that use AnimationController (Transition widgets)
    2. Advanced custom animation widgets that use an AnimationController (AnimatedWidget & AnimatedBuilder)
  • Choosing the right animation approach depending on your goal
Code in the talk can be found in this repository:
Flutter Festival Session - Flutter Animations
Flutter Festival Saudi Arabia - Flutter Animations [Arabic]

πŸ—“ Feb 19th, 2022

πŸŽ₯ Talk Video
Same above talk but in Arabic. Same code repo as well πŸ‘†πŸΌ.
Flutter Festival London - Flutter App REST API Integration with Caching

πŸ—“ March 27th, 2022

πŸŽ₯ Talk Video
Integrating a REST API and adding offline support to a Flutter application by caching API requests. Example app provided was a Flutter articles directory using the Dev.to API. Service locator & repository design patterns were used.

Flutter Puzzle Hack Project Repo
Flutter Festival Turkey - Live-coding a Theme & Primary Color Switcher

πŸ—“ April 16th, 2022

πŸŽ₯ Talk Video
I live coded a theme & primary color switcher with provider for state management and integrated local storage using Hive and the service locator pattern to persist user selection. Also talked a bit about testing and you can find more widget & unit tests in the repo.

Flutter Theme Switcher Repo

Flutter Tutorials

Aside from regularely sharing Flutter tips on Twitter, I usually publish articles on Medium whenever I have the chance (and the ideas):

Title Description Type Publish Date
Take Your Flutter Animations to The Next Level β€” Flutter Vikings Talk On August 31st, I did a talk titled β€œTake Your Flutter Animations to the Next Level” at the amazing Flutter Vikings conference and in this article you’ll find all the links and read a written version of the talk!. πŸ“„ Article πŸ—“ Sep 11, 2022
Flutter Animations Comprehensive Guide Everything you need to know about Flutter animations in great detail and with multiple examples. By the end of this article you’ll be able to add animations to your Flutter app with a wide range of complexity. And you’ll know which of the various approaches available in Flutter is best suited for your animation goals. πŸ“„ Article πŸ—“ Apr 25, 2022
Reducing Shader Compilation Jank On Mobile By Caching Warmed Up SkSL Improving the performance of your application is always important. And in the case of this slide puzzle game app, there were lots of animations and graphics, so it was vital that some work and effort be directed into making sure the performance of the app was at its best. πŸ“„ Article πŸ—“ Apr 1, 2022
Dashtronaut App Architecture and Folder Structure Details about the code, app architecture & folder structure of the slide puzzle game created for the Flutter Puzzle Hack Challenge πŸ“„ Article πŸ—“ Mar 20, 2022
Stars animation using CustomPainter Learn how to create animated stars using Flutter's CustomPainter and animations in this first tutorial from the Dashtronaut slide puzzle game πŸ“„ Article πŸ—“ Mar 14, 2022
Flutter ScrollPhysics Variations & Use Cases The β€˜physics’ widget param is found in all scrollable widgets (SingleChildScrollView, CustomScrollView, NestedScrollView, ListView, GridView, TabBarView, ListWheelScrollView …etc) In this article, I will go over the variation of ScrollPhysics that this param can take and what that variation does. πŸ“„ Article πŸ—“ Jan 29, 2022
Create a Theme and Primary Color Switcher For Your Flutter App Using Provider Learn how to create a functional theme switcher with the ability to change the primary color of your app using Provider. You will also learn how to change the primary color swatch and get MaterialColor from Color. πŸ“„ Article πŸ—“ Dec 20, 2021
Flutter Image Uploader With App Permissions and Compression Using GetIt Services Allow image upload in your Flutter app with one line of code in your widget while handling everything from camera & gallery permissions to image compression under the hood with GetIt and the service locator pattern. πŸ“„ Article πŸ—“ Dec 12, 2021

readme_updated's People

Contributors

roaa94 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.