<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="description" content="">
        <meta name="author" content="">
        <meta name="description" content="Developing iOS and Android apps with Flutter in the Netherlands. We are not endorsed by or affiliated with Google LLC.">
        <title>Dutch Flutter Exchange</title>
        <!-- Bootstrap core CSS -->
        <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet"> 
        <link href="style.css" rel="stylesheet">
        <link href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
    </head>
    <body>
        <!-- Navigation -->
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark static-top">
            <div class="container">
                <a class="navbar-brand" href="#home"><i class="fa fa-home"></i></a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarResponsive">
                    <ul class="navbar-nav ml-auto nav">
                        <li class="nav-item">
                            <a class="nav-link" href="#overFlutter">wat is Flutter?</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#leren">leren</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#apps">apps</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#boek">boek</a>
                        </li>                         
                        <li class="nav-item">
                            <a class="nav-link" href="#contact">contact</a>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
        <!-- home -->
        <section id="home">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-10 offset-lg-2 offset-md-1 text-center">
                        <h1 class="mt-5">Dutch Flutter™ Exchange</h1>
                        <p class="lead">Nederlandstalige bronnen voor app-ontwikkelaars, <br>beginners en geïnteresseerden.</p>
                        <p>Deze site is een uitwisselingsplaats voor ideeën, apps, tutorials en andere zaken rondom het ontwikkelplatform Flutter&trade;van Google. Wij zijn op geen enkele manier gelieerd aan Google. <br>Heeft u een bijdrage? Mail naar <a href="mailto:info@flutter.nl">info@flutter.nl</a> of praat mee op onze <a href="https://www.linkedin.com/groups/8935268/">LinkedIn-group</a>.</p>
                        <div class="row">
                            <p style="font-size: 12px;"></p>
                        </div>
                        <div class="row">
                            <div class="col-md-6 text-left">
                                <p><a href="#overFlutter">Wat is Flutter?</a></p>
                                <p><a href="#leren">Hoe leer ik (meer over) Flutter?</a></p>
                                <p><a href="#apps">Welke NL Flutter-apps zijn er?</a></p>
                            </div>
                            <div class="col-md-6"> 
                                <p class="text-left"><a href="#contact">Hoe vind ik een Flutter-developer?</a></p>
                                <p class="text-left"><a href="#boek">Hoe zit dat met dat boek over Flutter?</a></p>
                                <p class="text-left"><a href="#contact">Hoe laat ik mijn app/tutorial/bron zien?</a></p> 
                            </div>
                        </div>
                        <p></p>
                        <!--
                        <div class="row">
                            <div class="col-md-12 text-center">
                                <p>Nu overal verkrijgbaar: "<a href="#boek">Apps ontwikkelen met Flutter"</a>:<br>
                               het eerste Nederlandstalige Flutter-werkboek.</p>
                            </div>
                        </div>
                        <p class="text-left"> </p>
                        <p class="text-left"><a href="https://www.vanduurenmedia.nl/EAN/9789463561600?utm_rid=40181" style="text-align: center; background-color: rgb(3, 155, 229); letter-spacing: 0.01em;"><img src="flutterfoto_klein.jpg" width="100%"></a><span style="text-align: center; letter-spacing: 0.01em;">&nbsp; &nbsp; &nbsp;</span><br></p>
                        -->
                    </div>
                </div>
                <div class="row text-left">
</div>
            </div>
        </section>
        <!-- meedoen -->
        <section id="overFlutter">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-10 offset-lg-2 offset-md-1 text-center">
                        <h1 class="mt-5">Wat is Flutter™?</h1>
                        <p class="lead">Een naam die begint met &apos;flut&apos;, <br>is in het Nederlands geen goed begin.</p>
                        <p class="text-left">Flutter is Engels voor &apos;fladderen&apos;. Dat roept in die taal misschien associaties op met&nbsp;de snelheid, lichtvoetigheid en elegantie van een vlinder, maar in het Nederlands niet.&nbsp;<span style="letter-spacing: 0.01em;">Toch is Flutter een innovatief platform om apps te ontwikkelen voor iOS, Android, web en desktop. Kenmerken:</span></p>
                        <ul> 
                            <li>
                                <i>Echte</i> apps. Geen halfbakken, trage web-based of html-hybride app-achtige dingen met beperkte mogelijkheden. Animaties, games, infotainment, databases, connectivity, alles kan.
                            </li>                             
                            <li> Apps voor Android, iOS en meer vanuit één codebase. Geen javascript of andere tussenlaag: apps communiceren direct met de hardware en werken razendsnel.
</li>                             
                            <li>Flutter is door Google ontwikkeld, maar een open-source toolkit die zich razendsnel ontwikkelt. De Flutter-apps programmeren we in de programmeertaal Dart.
</li>                             
                            <li>Flutter is volop in ontwikkeling en wordt door 
                                <a href="https://flutter.dev/showcase">uiteenlopende grote bedrijven gebruikt</a>.
                                <ul> 
</ul>
                            </li>                             
                        </ul>
                        <p class="text-left">Meer weten over Flutter? <a href="https://flutter.dev">Bezoek de officiële Flutter-site</a> of <a href="https://www.linkedin.com/pulse/flutter-een-mijlpaal-app-ontwikkeling-mark-van-heck/">lees dit artikel op LinkdedIn</a>.          
                    </div>
                </div>
            </div>
        </section>
        <!-- leren -->
        <section id="leren">
            <div class="container">
                <div class="row">
                    <div class="text-center col-lg-8 col-md-10 offset-md-1 offset-lg-2" style="text-align: left;">
                        <h1 class="mt-5">Leer Flutter&trade;</h1>
                        <p class="lead">Bouw apps voor iOS, Android en meer.</p>
                        <p class="text-left">Voor ervaren programmeurs of webbouwers, is de overstap naar Flutter niet groot. Voor mensen zonder programmeerervaring is Flutter een prachtig startpunt. Deze pagina wordt een verzamelplaats van de Nederlandstalige tutorials en andere bronnen. Die zijn er nu nog niet. Maar daar hoeft u niet op te wachten als u Flutter wilt leren! </p>
                        <br>
                        <h3>Zoekt u het liefst zelf uw informatie?</h3>
                        <p style="text-align: left;">
                        Op <a href="https://flutter.dev">de officiële Flutter-site</a> vindt u veel Engelstalige uitleg en tutorials. Ook elders op het web vindt u veel informatie. De eerste <a href="https://blog.computercreatief.nl/apps-programmeren-in-flutter-in-de-online-omgeving-van-dartpad/">Nederlandstalige tutorial</a> vindt u hier.</p>
                        <br>
                        <h3>Leert u liever aan de hand van doordacht, Nederlandstalig materiaal?</h3>
                        <p style="text-align: left;"> <a href="#boek">Dit boek</a> is vooralsnog het enige Nederlandstalige boek. Het neemt u bij de hand en laat u stap voor stap zien hoe Flutter werkt.  </p>
                        <br>
                        <h3>Krijgt u liever uitleg?</h3>
                        <p style="text-align: left;">
                            Neem  <a href="mailto:mark@flutter.nl">contact</a> op voor een training op locatie, bijvoorbeeld in uw bedrijf. </p>
                    </div>
                </div>
            </div>
        </section>
        <!-- apps -->
        <section id="apps">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-10 offset-lg-2 offset-md-1 text-center">
                        <h1 class="mt-5">Apps</h1>
                        <p class="lead">Nederlandse apps, gemaakt met Flutter&trade;</p>
                        <p class="text-left">Deze pagina is een verzamelplaats van Nederlandse apps, gemaakt met Flutter. Kent u mooie voorbeelden? Neem <a href="mailto:mark@flutter.nl">contact</a> op. Internationale voorbeelden vindt u <a href="https://flutter.dev/showcase">hier</a>. </p>

                        <div class="app portraitApp">
                        	<a href="https://apps.apple.com/nl/app/cvrm-risicometer-2019/id1475103116"><img src="apps/cvrm.png"></a>
                        	Ongeveer 7.000 orgprofessionals gebruiken deze app om snel het risico op hart- en vaatziekten te berekenen en inzichtelijk te maken voor hun patiënten.
                        	<div class="badges">
                        	<https://play.google.com/store/apps/details?id=nl.uitlegentekst.flutter_app&hl=nl><img src="apps/google_badge.png"></a>
                        	<a href="https://apps.apple.com/nl/app/cvrm-risicometer-2019/id1475103116#?platform=iphone"><img src="apps/apple_badge.png"></a>
                       		 </div>
                        </div>	
                            <a name="veldgids"></a> 
                        <div class="app portraitApp">
                            <a href="https://apps.apple.com/nl/app/veldgids/id564158103"><img src="apps/veldgids.png"></a>
                           Altijd je digitale veldgids bij de hand. Een interactieve app met de meest voorkomende vogels(geluiden), veldbloemen, paddenstoelen en zoogdieren. De app heeft meer dan 600 soorten! Bewaar je waarnemingen met foto's en locaties en luister naar geluiden.
                            <div class="badges">
                            <a href="https://play.google.com/store/apps/details?id=nl.nature2u.veldgids&hl=nl"><img src="apps/google_badge.png"></a>
                            <a href="https://apps.apple.com/nl/app/veldgids/id564158103"><img src="apps/apple_badge.png"></a>
                             </div>
                        </div>  
                        
                        <div class="app landscapeApp">
                        	<a href="https://apps.apple.com/nl/app/party-wheel-make-your-own/id1072502717"><img src="apps/game_wheel.png"></a>
                        	Game Wheel is een fantastisch hulpmiddel voor alle games, quizzen en klasactiviteiten. Maar er is zoveel meer dat je kunt doen met Game Wheel! Gebruik het als een leuke manier om kleine beslissingen te nemen, dingen te verdelen of alternatieve dobbelstenen. De mogelijkheden zijn eindeloos.
                        	<div class="badges">
                        	<a href="https://play.google.com/store/apps/details?id=nl.uitlegentekst.gamewheel"><img src="apps/google_badge.png"></a>
                        	<a href="https://apps.apple.com/nl/app/party-wheel-make-your-own/id1072502717"><img src="apps/apple_badge.png" class="appleBadge"></a>
                       		 </div>
                        </div>	
                          
                            <a name="planningpal"></a> 
                            <div class="app portraitApp">
                            <a href="https://apps.apple.com/us/app/planning-pal/id1493210386?l=nl&ls=1"><img src="apps/planningpal.png"></a>
                           Vanuit de noodzaak om het gebruik van de wasmachine in een studentenhuis te plannen, ontwikkelden twee studenten een volwaardige, internationale plan-app voor alle gedeelde zaken. 
                            <div class="badges">
                                  <a href="https://play.google.com/store/apps/details?id=com.dutchappfarm.WasMaatje"><img src="apps/google_badge.png"></a>
                            <a href="https://apps.apple.com/us/app/planning-pal/id1493210386?l=nl&ls=1"><img src="apps/apple_badge.png"></a>
                          
                             </div>
                        </div>  
                        

                        
                              
                            </div>
                       </div>
                </div>
                <div class="row text-left">
</div>
            </div>
        </section>
        <!-- boek -->
        <section id="boek">
            <div class="container">
                <div class="row">
                    <div class="text-center col-lg-8 col-md-10 offset-md-1 offset-lg-2">
                        <h1 class="mt-5">Boek: Apps programmeren met Flutter&trade;</h1>
                        <p class="lead">Leer Flutter stap voor stap in het Nederlands</p>
                        <p class="text-left"><i>Apps ontwikkelen met Flutter</i> is de ideale opstap als u snel aan de slag wilt met Flutter. Dat kan als u ervaring hebt met web- of app-ontwikkeling, maar ook als u nog nooit eerder programmeerde. U leert vooral door te doen en bouwt mini-apps en een volledige app. Alle onderdelen van het proces komen aan bod: van installatie van de tools tot aan publicatie in de stores. Het grootste deel van het boek gaat uiteraard over het programmeren in Dart en het bouwen van Flutter apps. </p>
                        <p class="text-left"> </p>
                        <p class="text-left"><a href="https://www.vanduurenmedia.nl/EAN/9789463563031?utm_rid=40181">Lees meer en bestel</a> <br>  
                             <a href="https://boek.flutter.nl/Broncode_Flutter_3.zip">Broncode bij heb boek</a> <br>  
                            
                            <a href="https://boek.flutter.nl/Errata.pdf">Errata bij 'Apps programmeren met Flutter (2023)'</a> </br></br><b>
                        Bij oudere edities (Apps ontwikkelen met Flutter, editie 1 en 2):</b></br>
                            <a href="https://boek.flutter.nl/Errata_oud.pdf">Errata bij oudere edities</a> </br>
                            <a href="https://support.vanduurenmedia.nl/Downloads/9789463561600/Codevoorbeelden.zip">Broncode bij oudere edities</a> <br>  
                        <a href="https://www.vanduurenmedia.nl/EAN/9789463563031?utm_rid=40181"><img src="boek/flutter3.jpg" width="100%"></a>
                    </div>
                </div>
                <div class="row text-left">
</div>
            </div>
        </section>
        <!-- contact -->
        <section class="laatsteContainer" id="contact">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-10 offset-lg-2 offset-md-1 text-center">
                        <h1 class="mt-5">Contact</h1>
                        <p class="lead">Prachtige, supersnelle apps voor Android, iOS, desktop en web</p>
                        <p>Deze site is een uitwisselingsplaats voor ideeën, apps, tutorials en andere zaken rondom het ontwikkelplatform Flutter&trade;van Google. Wij zijn op geen enkele manier gelieerd aan Google. </p>
                    </div>
                </div>
                <div class="row text-left">
                    <div class="col-lg-6 col-md-8 offset-lg-3 offset-md-2 text-center">
                        <p class="text-left">Wilt u:</p>
                        <ul>                                                 
                            <li>een tutorial, app, column of iets anders over Flutter delen?</li>                             
                            <li>meer weten over Flutter?</li>   
                             <li>een app laten ontwikkelen voor iOS en Android?</li>                             
                            <li>een training organiseren over Flutter?</li>                                 
                        </ul>
                        <p style="text-align: left;">Neem dan contact op.</p>
                        <p class="text-left">Mark van Heck<br>Zelfstandig web- en app-ontwikkelaar, <br>trainer en educatief auteur in Nijmegen<br><a href="mailto:mark@flutter.nl" style="background-color: rgb(3, 155, 229); letter-spacing: 0.01em;">mark@flutter.nl</a><br><a href="https://www.hecktag.nl">www.hecktag.nl</a><br><br>
                        Of praat mee op onze <a href="https://www.linkedin.com/groups/8935268/">LinkedIn-groep</a></p>
                    </div>
                </div>
            </div>
        </section>
        <footer class="fixed-bottom">
            Flutter and the related logo are trademarks of Google LLC. We are not endorsed by or affiliated with Google LLC.
</footer>
        <!-- meedoen -->
        <!-- leren -->
        <!-- apps -->
        <!-- contact -->
        <!-- Bootstrap core JavaScript -->
        <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
        <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
        <script src="flutter.js"></script>
    </body>
</html>
