<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Erdem Gezer</title>
    <description>The latest articles on Forem by Erdem Gezer (@erdemgezer).</description>
    <link>https://forem.com/erdemgezer</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1014947%2F41b2f5f6-3668-43b7-b5a2-c2b13d41af4e.jpeg</url>
      <title>Forem: Erdem Gezer</title>
      <link>https://forem.com/erdemgezer</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/erdemgezer"/>
    <language>en</language>
    <item>
      <title>How I Built an MVP for the Next Unicorn in 1 Week: From Idea to App Store with No-Code and FlutterFlow</title>
      <dc:creator>Erdem Gezer</dc:creator>
      <pubDate>Sun, 14 Jul 2024 20:21:06 +0000</pubDate>
      <link>https://forem.com/erdemgezer/how-i-built-an-mvp-for-the-next-unicorn-in-1-week-from-idea-to-app-store-with-no-code-and-flutterflow-59bk</link>
      <guid>https://forem.com/erdemgezer/how-i-built-an-mvp-for-the-next-unicorn-in-1-week-from-idea-to-app-store-with-no-code-and-flutterflow-59bk</guid>
      <description>&lt;p&gt;As a software engineer, it’s very tempting to instantly open your favourite editor and start coding when a new idea pops up. &lt;/p&gt;

&lt;p&gt;A couple of weeks a ago, a very good friend of mine asked my help for building an MVP for the next unicorn startup idea 🦄 (who knows! 😉) For the first time in my 20 years of coder past, I resisted the urge of start coding on blank page and instead I wanted to give FlutterFlow a go, which is a no-code tool for building mobile apps.&lt;/p&gt;

&lt;h3&gt;
  
  
  How did I do it?
&lt;/h3&gt;

&lt;p&gt;To get the app up and running and publish to the App Store quickly, I followed these steps:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Paper prototype&lt;/li&gt;
&lt;li&gt;Start building by using pre-designed template screens&lt;/li&gt;
&lt;li&gt;Authentication&lt;/li&gt;
&lt;li&gt;Database and push notifications&lt;/li&gt;
&lt;li&gt;Submit to App Store and distribute with TestFlight&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let’s dive into each of these 5 steps one by one.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Paper prototype
&lt;/h2&gt;

&lt;p&gt;I believe prototyping is the fastest way of gathering requirements from the owner of the idea (or any other stakeholder). &lt;/p&gt;

&lt;p&gt;For the MVP, we sketched out the screens on a blank sheet to clearly see what’s expecting us in the development phase.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn5v7745law9gz5knlsrc.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn5v7745law9gz5knlsrc.jpg" alt="Paper prototype" width="800" height="1066"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Start building by using pre-designed template screens
&lt;/h2&gt;

&lt;p&gt;Flutter flow has hundreds of professionally designed screen templates for almost any kind of screen you might need such as login screens, product listings, checkout screens, etc.&lt;/p&gt;

&lt;p&gt;Thanks to these templates, you don’t have to start from scratch.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F56gu6dz8egc0ns1cqtor.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F56gu6dz8egc0ns1cqtor.png" alt="Pre-designed template screens" width="800" height="614"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 3: Authentication
&lt;/h2&gt;

&lt;p&gt;FlutterFlow is integrated with Firebase in a very smooth and seemless way that allows us using it for almost any kind of backend related tasks in our application. &lt;/p&gt;

&lt;p&gt;Implementing authentication with email/password, Google, Apple and many more providers is really straighforward.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ff8a4rxr39lfpkucz2xdi.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ff8a4rxr39lfpkucz2xdi.png" alt="Firebase authentication" width="800" height="255"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 4: Database and push notifications
&lt;/h2&gt;

&lt;p&gt;Again, Firebase handles all the hassle of creating a database (Firestore) and sending push notifications (Messaging) to your users. You can just create your database models such as users, posts and comments even without leaving the FlutterFlow dashboard.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F951332j8tofpuo6im2xc.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F951332j8tofpuo6im2xc.png" alt="Firebase Firestore" width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 5: Submit to App Store and distribute with TestFlight
&lt;/h2&gt;

&lt;p&gt;You have two options for submitting your app to App Store.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;You can download your Flutter code, build the project and publish it via Xcode.&lt;/li&gt;
&lt;li&gt;FlutterFlow can directly submit to the App Store for you.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;By the help of TestFlight’s public link feature, we were able to distribute the app to a group of 50+ early bird users just within a few minutes of time.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5u0gnbgkpqskbaza76lj.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5u0gnbgkpqskbaza76lj.png" alt="TestFlight public link" width="800" height="302"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;As a software engineer, my overall experience with FlutterFlow during this journey was quite satisfying. It helped me building an end-to-end MVP starting with a paper prototype, not writing any code and not doing and UI designs. I really enjoyed using the drag&amp;amp;drop builder which is usually a disappointing feature in other similar tools.&lt;/p&gt;

&lt;p&gt;Here is what I liked most about FlutterFlow while building the MVP:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Predesigned templates&lt;/li&gt;
&lt;li&gt;Drag and Drop builder&lt;/li&gt;
&lt;li&gt;Firebase integration&lt;/li&gt;
&lt;li&gt;Automated testing&lt;/li&gt;
&lt;li&gt;Code export (Flutter)&lt;/li&gt;
&lt;li&gt;Custom code if needed&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;Throughout this journey, FlutterFlow not only helped me build an MVP quickly but also reshaped my perspective on no-code development. It empowered me to bring ideas to life faster than ever before. I hope my story inspires you to explore no-code tools and transform your own ideas into reality.&lt;/p&gt;

&lt;p&gt;Let’s connect! Share your no-code experiences in the comments and follow me for more real-life development stories and tips."&lt;/p&gt;

</description>
      <category>nocode</category>
      <category>flutter</category>
      <category>mobile</category>
      <category>startup</category>
    </item>
  </channel>
</rss>
