tag:blogger.com,1999:blog-44095148033313154622024-03-13T10:19:48.751+01:00Jana Moudrá blogAnonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.comBlogger19125tag:blogger.com,1999:blog-4409514803331315462.post-24817809755878432442017-01-26T14:06:00.000+01:002017-02-08T14:06:45.552+01:00What I've baked the last year<b>I love helping developers, <a href="http://www.moudra.net/p/my-speaking-engagements.html">speaking at conferences</a>,</b> doing workshops, code labs and such kind of stuff. But before any event, I need to prepare myself very carefully and this takes me days and days of my time. In the past years I created a couple of (totally) different demos and workshops which sit on <a href="https://github.com/Janamou">my Github</a> without anybody knowing.<br />
<br />
So I decided to share the latest ones I "baked" in this blog post, because maybe you find here something interesting for you :-)<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://1.bp.blogspot.com/-3lS0xokrO2s/WInMYFup-jI/AAAAAAAAOLM/57MTTeY6b6QwLN0uD9HCXHrdRSFzjXx_ACLcB/s1600/gingerbread.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="400" src="https://1.bp.blogspot.com/-3lS0xokrO2s/WInMYFup-jI/AAAAAAAAOLM/57MTTeY6b6QwLN0uD9HCXHrdRSFzjXx_ACLcB/s400/gingerbread.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><h1 style="background-color: white; border: 0px; font-family: proxima-nova, "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: inherit; font-stretch: inherit; font-variant-numeric: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; text-align: center; vertical-align: baseline;">
<span style="border: 0px; font-family: inherit; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">After my Gingerbread hackathon: 9 Christmas trees 😂 </span></h1>
</td></tr>
</tbody></table>
<br />
Uh, baking? I even managed to have the gingerbread and (czech) cookies baking hackathon in the end of the last year :-D<br />
<br />
<h2>
<span style="font-size: large;">Dart server code lab</span></h2>
I am going to start with my Dart server code lab from 2015. This code lab was originally created for DevFest Ukraine 2015 (and used in a couple of other DevFests then) and aims <b>Dart on server side</b> using the <a href="https://pub.dartlang.org/packages/rpc">RPC library</a>. I have also written a <a href="http://www.moudra.net/2016/01/dart-rpc-create-restful-api-in-couple.html">blog post</a> about it.<br />
<br />
In this code lab you can learn how to do a server side API with Dart extremely fast: <a href="https://github.com/Janamou/dart-server-codelab">https://github.com/Janamou/dart-server-codelab</a>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://2.bp.blogspot.com/-hVT3lB5w6gU/WFEiyqlLktI/AAAAAAAAN4c/QZ9cGzyN3kYMjyk8-ip891r8wh0-3HFrgCLcB/s1600/dart-server.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="245" src="https://2.bp.blogspot.com/-hVT3lB5w6gU/WFEiyqlLktI/AAAAAAAAN4c/QZ9cGzyN3kYMjyk8-ip891r8wh0-3HFrgCLcB/s400/dart-server.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="font-size: 12.8px;">Dart server-side Code Lab: <a href="https://github.com/Janamou/dart-server-codelab">https://github.com/Janamou/dart-server-codelab</a></td></tr>
</tbody></table>
<br />
<h2>
<span style="font-size: large;">Android testing workshop</span></h2>
Let's forget about the web (for a moment) and take a look at the <i>Android side</i>. The last DevFest Ukraine, I had a workshop on Android UI testing. During the workshop, I showed the options for UI tests on Android, why is important to write them and how tests help with the app development workflow.<br />
<br />
The workshop has four parts - UI tests with UI Automator library, Espresso library, Test recorder tool and Monkey tool. You can explore it here: <a href="https://github.com/Janamou/android-testing-codelab">https://github.com/Janamou/android-testing-codelab</a>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://3.bp.blogspot.com/-nqNZEjnQQu4/WInQNqC44WI/AAAAAAAAOLY/-eNoKQ84-C8YiChIGQz-RA1Dqgxw_uqEACLcB/s400/android-testing.png" width="400" /></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://docs.google.com/presentation/d/1vBDKd_bLSgL0E0g1yMrtH-OLwF9DrepYzHXdePp6lXc/edit#slide=id.p">Slides</a></td></tr>
</tbody></table>
<br />
You can also see my <a href="https://docs.google.com/presentation/d/1vBDKd_bLSgL0E0g1yMrtH-OLwF9DrepYzHXdePp6lXc/edit#slide=id.p">introduction to Andorid UI testing slides</a>.<br />
<br />
<h2>
<span style="font-size: large;">Progressive Web Apps talk</span></h2>
<a href="https://developers.google.com/web/progressive-web-apps/">PWAs</a> are a big thing. And I had a talk on last year's WebExpo about it. <a href="https://slideslive.com/38898298/progressive-web-apps">In the talk</a>, I explained why Progressive Web Apps are great, why and when you need them and I also showed a demo.<br />
<br />
The demo is <a href="https://webexpo-demo.firebaseapp.com/">online</a> and it displays the list of "PWA" repositories from Github, caches the <a href="https://developers.google.com/web/updates/2015/11/app-shell">app shell</a> and it also caches the repositories in case the connection is lost. The <a href="https://developers.google.com/web/fundamentals/getting-started/primers/service-workers">service workers</a> are used for all these cool features in the application. The code is available on my Github: <a href="https://github.com/Janamou/pwa-demo">https://github.com/Janamou/pwa-demo</a>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://2.bp.blogspot.com/-vinQt74N2UA/WInU-eI4cHI/AAAAAAAAOLk/n-EvfBziEMc9aoxUia1IdQHoqi3Pg1gewCLcB/s400/pwa.png" width="400" /></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="http://www.slideshare.net/Janamou/progressive-web-apps-66345375">Slides</a></td></tr>
</tbody></table>
<br />
You can also see my <a href="http://www.slideshare.net/Janamou/progressive-web-apps-66345375">Progressive Web Apps slides</a>.<br />
<br />
<h2>
<span style="font-size: large;">How to build a Dart and Firebase app talk</span></h2>
This talk is from the last Dart summit and I have already wrote <a href="http://www.moudra.net/2016/11/dart-developer-summit-2016.html">a blog post</a> about it. <a href="https://www.youtube.com/watch?v=naNr0F6mHjw">In the talk</a>, I explained how you can use Dart together with Firebase using <a href="http://www.moudra.net/2016/12/dart-firebase3-lib-is-now-firebase.html">the library</a>.<br />
<br />
The demo is also <a href="http://notesboard-3796a.firebaseapp.com/">online</a> and it is a simple notes board completely written in Dart (it uses the pure <span style="font-family: "courier new" , "courier" , monospace;">dart:html</span> to make it simple/no fancy architecture). You can explore the auth, database and storage options provided by Firebase. The code is also on my Github: <a href="https://github.com/Janamou/firebase-demo">https://github.com/Janamou/firebase-demo</a>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://1.bp.blogspot.com/-UmjDhvMsVPY/WInZ81nx4VI/AAAAAAAAOL0/O8CUDD7wYbwbgx1RmaKkXrH7Sqbha58nACLcB/s1600/dart-firebase.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://1.bp.blogspot.com/-UmjDhvMsVPY/WInZ81nx4VI/AAAAAAAAOL0/O8CUDD7wYbwbgx1RmaKkXrH7Sqbha58nACLcB/s400/dart-firebase.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="http://www.slideshare.net/Janamou/how-to-build-a-dart-and-firebase-app-in-30-mins">Slides</a></td></tr>
</tbody></table>
<br />
You can also see my <a href="http://www.slideshare.net/Janamou/how-to-build-a-dart-and-firebase-app-in-30-mins">Dart and Firebase talk slides</a>.<br />
<br />
<b><br /></b>
<b>Happy coding and successful year 2017! :-D</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czechia50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-35206333093490765732016-12-18T20:05:00.002+01:002016-12-18T20:06:50.121+01:00Dart Firebase3 lib is now FirebaseJust a quick update on <b>Firebase Dart</b> library.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://3.bp.blogspot.com/-Y85R1_aLP4c/WFbdkZXw6cI/AAAAAAAAN6w/2SsUy567u_0gY0Bl_QWQwMrW_F4vB7HRACLcB/s1600/dart_fb.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://3.bp.blogspot.com/-Y85R1_aLP4c/WFbdkZXw6cI/AAAAAAAAN6w/2SsUy567u_0gY0Bl_QWQwMrW_F4vB7HRACLcB/s1600/dart_fb.jpg" /></a></div>
<span id="goog_1167250037"></span><span id="goog_1167250038"></span><br />
<br />
My library <a href="https://pub.dartlang.org/packages/firebase3">Firebase3</a> has been <b>deprecated</b> and <b>moved</b> to the official <a href="https://pub.dartlang.org/packages/firebase">Firebase</a> repo (yay!) and <b>is going to be developed there</b>.<br />
<br />
The update in your project is really easy, so please do it:<br />
<br />
<h2>
<span style="font-size: large;"><span style="font-family: inherit;">pubspec.yaml</span></span></h2>
Update your project's <span style="font-family: "courier new" , "courier" , monospace;">pubspec.yaml</span><span style="font-family: inherit;"> </span>file. Change the <span style="font-family: "courier new" , "courier" , monospace;">firebase3</span> dependency to <span style="font-family: "courier new" , "courier" , monospace;">firebase</span>:<br />
<br />
<pre class="brush: bash">dependencies:
firebase: '^3.0.0'
</pre>
<br />
<h2>
<span style="font-size: large;">Pub get</span></h2>
Do the <span style="font-family: "courier new" , "courier" , monospace;">pub get</span><span style="font-family: inherit;"> to get the latest dependencies.</span><br />
<span style="font-family: inherit;"><br /></span>
<br />
<h2>
<span style="font-family: inherit; font-size: large;">Imports</span></h2>
<span style="font-family: inherit;">Update </span><span style="font-family: "courier new" , "courier" , monospace;">import</span><span style="font-family: inherit;">s in your project to use the </span><span style="font-family: "courier new" , "courier" , monospace;">firebase</span><span style="font-family: inherit;"> library:</span><br />
<span style="font-family: inherit;"><br /></span>
<br />
<pre class="brush: java">import 'package:firebase/firebase.dart';
</pre>
<span style="font-family: inherit;"><br /></span>
<br />
<b>And you are done!</b><br />
<br />
The <a href="https://github.com/Janamou/firebase-demo">Dart summit Firebase project</a> has been already updated for the latest <span style="font-family: "courier new" , "courier" , monospace;">firebase</span> lib.<br />
<br />
Happy coding! :-)<br />
<br />Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-37474298970896523712016-11-03T17:15:00.000+01:002016-11-03T17:23:21.065+01:00Dart Developer Summit 2016I was happy that I could attend this year's Dart Dev Summit because <a href="http://www.moudra.net/2015/05/dart-developer-summit-awesome-two-days.html" target="_blank">the last Dart Dev Summit</a> was awesome.<br />
<br />
The <a href="https://events.dartlang.org/2016/summit/" target="_blank">Dart Developer Summit 2016</a> took place in Munich's Google office this year, for two days at the end of October. <b>And it was really worth to visit.</b><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://3.bp.blogspot.com/-f9Y9K7aJuhA/WBnFJkObOZI/AAAAAAAANXI/dKbvNP_Gb8cooAjMHwKZZ7gEHGvHLqe8wCLcB/s1600/dart-s.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="169" src="https://3.bp.blogspot.com/-f9Y9K7aJuhA/WBnFJkObOZI/AAAAAAAANXI/dKbvNP_Gb8cooAjMHwKZZ7gEHGvHLqe8wCLcB/s320/dart-s.png" width="320" /></a></div>
<br />
<br />
<h2>
<span style="font-size: large;">New Dart earrings</span></h2>
Couple of days before a summit, I realized that my current <b>Dart earrings</b> are a bit of outdated. We had <a href="http://www.moudra.net/p/my-speaking-engagements.html" target="_blank">so much fun together</a> but the update was inevitable. And I knew I wanted to have them 3D printed.<br />
<br />
In Saturday afternoon, I decided "now or never" and opened the 3D modeling software after, ehm, 5 years and started to remember how it worked. I forgot almost everything. Fortunately I <i>somehow</i> managed to have the model finished (after a lots of complaints :-D) and we could go to print!<br />
<br />
We had to do a couple of iterations but at the end I had the earrings printed and put together. Let's call them <b>Dart earrings 2 RC1</b> for now.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://4.bp.blogspot.com/-UaBMZgcyiIE/WBnC7i4KeJI/AAAAAAAANW8/UufB1S41SYcxFXilJorBOoIJITBreWAHwCLcB/s1600/dart-earrings-old-new.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://4.bp.blogspot.com/-UaBMZgcyiIE/WBnC7i4KeJI/AAAAAAAANW8/UufB1S41SYcxFXilJorBOoIJITBreWAHwCLcB/s320/dart-earrings-old-new.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart earrings: the old vs. the new version</td></tr>
</tbody></table>
<br />
The earrings need some iterations still. And I am planning to release the 3D model when they will be perfect ;-)<br />
<br />
<h2>
<span style="font-size: large;">Dart Code Lab</span></h2>
<div>
<span style="font-family: inherit;">The evening before the summit, I helped with the organization of the Dart Code Lab again. Attendees could <b>try two new Dart code labs</b> - the first one on </span><a href="https://webdev.dartlang.org/codelabs/angular2_components" target="_blank">AngularDart components</a> and the second one on the developer workflow.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://1.bp.blogspot.com/-gqcYEaEZdMM/WBser5OTK4I/AAAAAAAANZ0/LmLE88ApptElMdzNtTi1KBR_q0wyQ18gACLcB/s1600/dart-codelab.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="302" src="https://1.bp.blogspot.com/-gqcYEaEZdMM/WBser5OTK4I/AAAAAAAANZ0/LmLE88ApptElMdzNtTi1KBR_q0wyQ18gACLcB/s320/dart-codelab.jpg" width="320" /></a></div>
<br />
<br />
We had also a lots of awesome <b>demos from attendees</b> showing us the projects they built with Dart. I enjoyed the evening with people from the community very much.<br />
<br />
<h2>
<span style="font-size: large;">Dart Developer Summit</span></h2>
The Dart summit was two days event. The first day started with the keynote - <a href="https://www.youtube.com/watch?v=JXcNqXbCa0E" target="_blank">Dart in 2017 and beyond</a> where we could hear a lots of interesting numbers (did you know that there is more than <b>$70B</b> per year in Google applications written in Dart?) and about the actual Dart's state and focus. You can read more about this in the <a href="http://news.dartlang.org/2016/10/dart-in-2017-and-beyond.html" target="_blank">Dart news</a> blog post.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://3.bp.blogspot.com/-UEiekloC8Wo/WBs8kmz9vVI/AAAAAAAANa4/fmX3ONX7B-wKN7yB__BpSqdKtqUHencZwCLcB/s1600/dart-summit.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="300" src="https://3.bp.blogspot.com/-UEiekloC8Wo/WBs8kmz9vVI/AAAAAAAANa4/fmX3ONX7B-wKN7yB__BpSqdKtqUHencZwCLcB/s400/dart-summit.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart Dev Summit 2017 - on a boat? :-D</td></tr>
</tbody></table>
<br />
The summit then continued with a lots of interesting talks on various topics like <b><a href="https://www.youtube.com/watch?v=8ixOkJOXdMo&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=2" target="_blank">Angular 2 Dart</a> and it's <a href="https://www.youtube.com/watch?v=vAUUOwBJetg&index=6&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">components</a></b>, the set of material design widgets written in AngularDart for developers.<br />
<br />
We also heard about <a href="https://www.youtube.com/watch?v=DKG5CMyol9U&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=3" target="_blank">Dart's type system</a> and a strong mode, the <a href="https://www.youtube.com/watch?v=oH6czEQwHdE&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=4" target="_blank">Dart Dev Compiler</a> (yay!), and about the <a href="https://www.youtube.com/watch?v=aIonwL-8hdE&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=5" target="_blank">Dart to JavaScript interoperability</a> and more. The JS interop talk is a definitely "must see" if you consider writing a wrapper around some existing JS library.<br />
<br />
The conferences are not only about talks. We had a lot of space to <b>meet and talk</b> with Dart engineers and developers from the whole world.<br />
<div>
<br /></div>
I must also say that I loved the setup and decorations in the room.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://2.bp.blogspot.com/-7oM_8U8blHo/WBtDCVxn7RI/AAAAAAAANcA/K82bwnifdyYiUJL_gsquVNkIHkoGMOL8ACLcB/s1600/dart-setup.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="240" src="https://2.bp.blogspot.com/-7oM_8U8blHo/WBtDCVxn7RI/AAAAAAAANcA/K82bwnifdyYiUJL_gsquVNkIHkoGMOL8ACLcB/s320/dart-setup.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Darts everywhere...</td></tr>
</tbody></table>
<br />
The second day started with the <a href="https://www.youtube.com/watch?v=Mx-AllVZ1VY&index=11&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">Flutter keynote</a>. <a href="https://flutter.io/" target="_blank">Flutter</a> is a project which helps you to build both iOS and Android applications with Dart.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://3.bp.blogspot.com/-AebyrE2iH_M/WBtflsJYrsI/AAAAAAAANcs/5kA3o8NDjgUGBl8fBBP9mQazj2SjvNH5ACLcB/s1600/flutter-2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://3.bp.blogspot.com/-AebyrE2iH_M/WBtflsJYrsI/AAAAAAAANcs/5kA3o8NDjgUGBl8fBBP9mQazj2SjvNH5ACLcB/s320/flutter-2.jpg" width="240" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Flutter Flutter Flutter</td></tr>
</tbody></table>
<br />
Over the year, they moved the project (it was named <i>Sky</i> before) so much forward and with the <a href="https://www.youtube.com/watch?v=iPlPk43RbpA&index=12&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">hot reload feature</a>, the development is even faster and more delightful to developer.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://2.bp.blogspot.com/-sgrTzY9B6Og/WBtOpJG_sFI/AAAAAAAANcc/VZRr6NS0_28oyE7t2E9Q4jdzT_62DMO1gCLcB/s1600/hot-reload.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="240" src="https://2.bp.blogspot.com/-sgrTzY9B6Og/WBtOpJG_sFI/AAAAAAAANcc/VZRr6NS0_28oyE7t2E9Q4jdzT_62DMO1gCLcB/s320/hot-reload.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Flutter's hot reload: <a href="https://www.youtube.com/watch?v=iPlPk43RbpA&index=12&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2"><span id="goog_1649216912"></span>must see<span id="goog_1649216913"></span></a></td></tr>
</tbody></table>
<br />
I was <b>very impressed</b> and I am moving my personal todo "try Flutter" more to the top of my todo list. :-D<br />
<br />
During the day we could see more talks on for example Google's build tool <a href="https://www.youtube.com/watch?v=zZnGUknpFMM&index=15&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">Bazel</a>, server-side <a href="https://www.youtube.com/watch?v=twr3cDFCeo4&index=16&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">framework Aqueduct</a> or Dart <a href="https://www.youtube.com/watch?v=ekBD-_jRjds&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=17" target="_blank">package for React</a>.<br />
<br />
The day ended with a panel discussion where we could ask questions and the Dart team answered.<br />
<div>
<br /></div>
<b>All the videos from talks are online in the <a href="https://www.youtube.com/playlist?list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2" target="_blank">Dart Dev Summit 2016 playlist</a>.</b><br />
<br />
<h2>
<span style="font-size: large;">My Firebase talk</span></h2>
<div>
I was excited to have a talk on <b>How to build a Dart and Firebase app in 30 mins</b>. During the talk I showed what is a <a href="http://firebase.google.com/" target="_blank">Firebase</a> and how to use this service with Dart using the wrapper library <b>Firebase3</b>, I implemented. The library is available on <a href="https://pub.dartlang.org/packages/firebase3" target="_blank">pub</a> and <a href="https://github.com/Janamou/firebase3-dart" target="_blank">Github</a>.<br />
<br />
I am planning to write some article on how to use Dart + Firebase and how to write a JS interop wrapper soon.<br />
<br />
For now you can take a look at the <a href="https://www.youtube.com/watch?v=naNr0F6mHjw&list=PLOU2XLYxmsILKY-A1kq4eHMcku3GMAyp2&index=10" target="_blank">talk on Youtube</a>, explore <a href="http://www.slideshare.net/Janamou/how-to-build-a-dart-and-firebase-app-in-30-mins" target="_blank">the slides</a>, or the <a href="https://github.com/Janamou/firebase-demo" target="_blank">source code</a> for the <a href="https://notesboard-3796a.firebaseapp.com/" target="_blank">demo app</a> I showed.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://4.bp.blogspot.com/-tlJHJU_gtn4/WBshRCz4BKI/AAAAAAAANaA/pfAqNevxgCIuCCz1_4ImMzDr9zuaPAdVQCLcB/s1600/dartsummit-demo.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="316" src="https://4.bp.blogspot.com/-tlJHJU_gtn4/WBshRCz4BKI/AAAAAAAANaA/pfAqNevxgCIuCCz1_4ImMzDr9zuaPAdVQCLcB/s400/dartsummit-demo.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">The demo is <a href="https://notesboard-3796a.firebaseapp.com/" target="_blank">available online</a>, the source code is <a href="https://github.com/Janamou/firebase-demo" target="_blank">on Github</a>.</td></tr>
</tbody></table>
<br />
The <a href="https://notesboard-3796a.firebaseapp.com/" target="_blank">demo is publicly available</a> and is written in Dart using the Firebase library, then compiled and deployed to <a href="https://firebase.google.com/docs/hosting/" target="_blank">Firebase hosting</a>.<br />
<br />
<h2>
<span style="font-size: large;">The end</span></h2>
It's always so sad when such great event ends. The Dart Developer Summit was a really great event, I met a lots of Dart developers and saw really nice talks on topics which interest me. I filled my personal todo list with a lots of "must try" or "must explore" things.<br />
<br />
I am really looking forward to the next year's summit and <b>see ya on a boat! :-D</b></div>
<br /></div>
Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-65958204318741353892016-01-07T15:40:00.001+01:002016-12-14T11:32:51.499+01:00Dart RPC: Create RESTful API in a couple of minutesI am on the <b>front-end</b> mostly because I like to work with UI. But let's move on and try something new, a little bit of <b>server-side</b>...<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-rjpItoIZZuU/Vo43AT8XbMI/AAAAAAAAKdA/bH0MgBC6CyI/s1600/3694850.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://4.bp.blogspot.com/-rjpItoIZZuU/Vo43AT8XbMI/AAAAAAAAKdA/bH0MgBC6CyI/s320/3694850.jpg" width="320" /></a></div>
<br />
In this blog post I show you how to create your RESTful server-side API in Dart really fast! :-)<br />
<br />
<h2>
<span style="font-size: large;">How to start</span></h2>
<div>
There is a really nice library on pub called <a href="https://pub.dartlang.org/packages/rpc" target="_blank">RPC</a>. It is a light-weight package for creating RESTful server-side Dart APIs. And this library is everything we need.<br />
<br />
Let's start with adding dependency into <span style="font-family: "courier new" , "courier" , monospace;">pubspec.yaml</span> in our project:<br />
<br />
<pre class="brush: bash">dependencies:
rpc: "^0.5.5"
</pre>
<br />
And then call <span style="font-family: "courier new" , "courier" , monospace;">pub get</span> to get the package into our project.<br />
Now you can import it.<br />
<br />
<pre class="brush: bash">import 'package:rpc/rpc.dart';
</pre>
<br />
<h2>
<span style="font-size: large;">Create API class</span></h2>
We need to create API class which wraps our API. It is a Dart class with special <span style="font-family: "courier new" , "courier" , monospace;">@ApiClass</span> annotation from the RPC library. The annotation has one mandatory parameter - <span style="font-family: "courier new" , "courier" , monospace;">version</span> where we provide a version for our API. For example <span style="font-family: "courier new" , "courier" , monospace;">v1</span>. You can also optionally provide other parameters like <span style="font-family: "courier new" , "courier" , monospace;">name</span><span style="font-family: inherit;"> to be able to rename the API</span>.<br />
<br />
<pre class="brush: java">@ApiClass(version: 'v1')
class MyApi {
// here will be contents of the class.
}
</pre>
<br />
<h2>
<span style="font-size: large;">API methods</span></h2>
We want to be able to provide API methods like <span style="font-family: "courier new" , "courier" , monospace;">GET</span>, <span style="font-family: "courier new" , "courier" , monospace;">POST</span>, <span style="font-family: "courier new" , "courier" , monospace;">DELETE</span>, etc. We put them in our already prepared API class with special annotation.<br />
<br />
Methods can be put directly into our API class or API resources can be used.<br />
<br />
<h2>
<span style="font-size: small;">Methods in API class</span></h2>
</div>
<div>
Here we create the <span style="font-family: "courier new" , "courier" , monospace;">GET</span> all animals and <span style="font-family: "courier new" , "courier" , monospace;">POST</span> animal method. Every API method has to have the <span style="font-family: "courier new" , "courier" , monospace;">@ApiMethod</span> annotation with mandatory <span style="font-family: "courier new" , "courier" , monospace;">path</span> parameter where we specify the path which is used for calling of our method. We can also specify the <span style="font-family: "courier new" , "courier" , monospace;">method</span> parameter where we provide type of the method which will be used. If the method parameter is omitted, the <span style="font-family: "courier new" , "courier" , monospace;">GET</span> is used.<br />
<br /></div>
<pre class="brush: java">@ApiClass(version: 'v1')
class MyApi {
List _animals = [];
@ApiMethod(path: 'animals')
List<Animal> getAnimals() => _animals;
@ApiMethod(path: 'animals', method: 'POST')
Animal postAnimal(Animal animal) {
_animals.add(animal);
return animal;
}
}
</pre>
<br />
We are using <span style="font-family: "courier new" , "courier" , monospace;">List</span> for saving of our animals in this example. And we provide two methods: <span style="font-family: "courier new" , "courier" , monospace;">getAnimals()</span> which returns a list of all animals and <span style="font-family: "courier new" , "courier" , monospace;">postAnimal()</span> which saves a new animal into our list. Easy. Of course we could extend our example API with other methods.<br />
<br />
To have it working we also need to have our <span style="font-family: "courier new" , "courier" , monospace;">Animal</span> class:<br />
<br />
<pre class="brush: java">class Animal {
int id;
String name;
int numberOfLegs;
}
</pre>
<br />
<h2>
<span style="font-size: small;">API resources</span></h2>
Usually we want to divide our API into resources which wrap the particular API methods. We want to for example have one API resource for an Animal and one API resource for a Person. We can do this with the RPC library easily.<br />
<br />
Create the resource class and <b>move all the resource methods</b> in it:<br />
<br />
<pre class="brush: java">class AnimalResource {
List _animals = [];
@ApiMethod(path: 'animals')
List<Animal> getAnimals() => _animals;
@ApiMethod(path: 'animals', method: 'POST')
Animal postAnimal(Animal animal) {
_animals.add(animal);
return animal;
}
}
</pre>
<br />
And then <b>create</b> the <span style="font-family: "courier new" , "courier" , monospace;">AnimalResource</span> instance into our API class with <span style="font-family: "courier new" , "courier" , monospace;">@ApiResource</span> annotation:<br />
<br />
<pre class="brush: java">@ApiClass(version: 'v1')
class MyApi {
@ApiResource()
AnimalResource resource = new AnimalResource();
}
</pre>
<br />
<h2>
<span style="font-size: large;">Test the API</span></h2>
To be able to use and test our API, we need to create the server script in <span style="font-family: "courier new" , "courier" , monospace;">bin/</span> folder. We need to create the <span style="font-family: "courier new" , "courier" , monospace;">ApiServer</span> there, add it our API and create a new <span style="font-family: "courier new" , "courier" , monospace;">HttpServer</span> which starts listening on <span style="font-family: "courier new" , "courier" , monospace;">localhost:8080</span>.<br />
<br />
<pre class="brush: java">library my_server;
import 'dart:io';
import 'package:logging/logging.dart';
import 'package:rpc/rpc.dart';
import '../lib/server/api.dart';
final ApiServer apiServer = new ApiServer(prettyPrint: true);
main() async {
Logger.root..level = Level.INFO..onRecord.listen(print);
apiServer.addApi(new MyApi());
HttpServer server = await HttpServer.bind(InternetAddress.ANY_IP_V4, 8080);
server.listen(apiServer.httpRequestHandler);
print('Server listening on http://${server.address.host}: ${server.port}');
}
</pre>
<br />
Then run the Dart script in <span style="font-family: "courier new" , "courier" , monospace;">bin/</span> which starts the server and explore the API methods. Our API is available on <span style="font-family: "courier new" , "courier" , monospace;">localhost:8080/myApi/v1</span>. If we want to get a list of all animals, we call <span style="font-family: "courier new" , "courier" , monospace;">GET</span> on <span style="font-family: "courier new" , "courier" , monospace;">localhost:8080/myApi/v1/animals</span>. Or we can try the <span style="font-family: "courier new" , "courier" , monospace;">POST</span> for the new animal on the same address <span style="font-family: "courier new" , "courier" , monospace;">localhost:8080/myApi/v1/animals</span>.<br />
<br />
Trying a <span style="font-family: "courier new" , "courier" , monospace;">POST</span> method is more difficult because we need to either install a tool like <a href="http://curl.haxx.se/" target="_blank">curl</a> or we can use some extension to Chrome (like <a href="https://chrome.google.com/webstore/detail/advanced-rest-client/hgmloofddffdnphfgcellkdfbfbjeloo" target="_blank">Advanced REST client</a> or <a href="https://chrome.google.com/webstore/detail/postman/fhbjgbiflinjbdggehcddcbncdddomop" target="_blank">Postman</a>).<br />
<br />
And that's all! Now you have a really simple Dart API created in a couple of minutes.<br />
<br />
<h2>
<span style="font-size: large;">Where can I find more?</span></h2>
This library can do even more. You can find all information about this library on the official <a href="https://pub.dartlang.org/packages/rpc" target="_blank">RPC's site on pub</a> or on <a href="https://github.com/dart-lang/rpc" target="_blank">Github</a>.<br />
<br />
<h2>
<span style="font-size: large;">My server Code Lab</span></h2>
I was happy to be and <a href="http://www.moudra.net/p/my-speaking-engagements.html" target="_blank">talk at couple of DevFests</a> last year, where I had also a Dart code lab. My code lab was about server-side and as you could guess, I used the RPC library :-) You can take a look at and try the code lab on <a href="https://github.com/Janamou/dart-server-codelab" target="_blank">my Github</a>.<br />
<br />
Happy coding!Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-74182921906081887332015-11-05T13:41:00.001+01:002015-11-05T13:41:18.895+01:003 simple steps for Sass in your Dart projectI really like <a href="http://sass-lang.com/">Sass</a> and I can't imagine writing css without it. With Sass you can use variables, mixins, nest your css and do <a href="http://sass-lang.com/documentation/file.SASS_REFERENCE.html">lots of things</a> in css.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-R3MS9fGQff8/VjtM9936mTI/AAAAAAAAI8w/GUyHvWcTx9w/s1600/Screen%2BShot%2B2015-11-05%2Bat%2B13.34.10.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="156" src="http://2.bp.blogspot.com/-R3MS9fGQff8/VjtM9936mTI/AAAAAAAAI8w/GUyHvWcTx9w/s200/Screen%2BShot%2B2015-11-05%2Bat%2B13.34.10.png" width="200" /></a></div>
<br />
<br />
So why not use Sass in your Dart project? <b>It's really easy. </b><br />
<br />
You need to have Sass <b>installed</b> and available on the <b>path</b>. For how to check the <a href="http://sass-lang.com/install">official website</a>.<br />
<br />
And now add Sass to your Dart project:<br />
<br />
<h2>
<span style="font-size: large;">1) Install Sass package</span></h2>
Find Sass package on pub. Here it is: <a href="https://pub.dartlang.org/packages/sass">https://pub.dartlang.org/packages/sass</a>.<br />
<br />
<h2>
<span style="font-size: large;">2) Update pubspec.yaml</span></h2>
Add Sass dependency in your project's <span style="font-family: "courier new" , "courier" , monospace;">pubspec.yaml</span>. Don't forget to add <span style="font-family: "courier new" , "courier" , monospace;">transformers</span> too:<br />
<br />
<pre class="brush: bash">name: super_cute_app
description: My super cute app!
dependencies:
…
sass: any
transformers:
- sass
</pre>
<br />
And then run <b><span style="font-family: Courier New, Courier, monospace;">pub get</span></b>.<br />
<br />
<h2>
<span style="font-size: large;">3) Use it </span></h2>
Now you can create and use <span style="font-family: "courier new" , "courier" , monospace;">.sass</span> and <span style="font-family: "courier new" , "courier" , monospace;">.scss</span> files in your project and these files will be automatically transformed to corresponding <span style="font-family: "courier new" , "courier" , monospace;">.css</span> files.<br />
<br />
This package has also some more <a href="https://pub.dartlang.org/packages/sass">options</a>.<br />
<br />
<h2>
<span style="font-size: large;">Bonus: Live reload</span></h2>
Do you know <a href="http://livereload.com/">Live reload</a>? No? I am using this tool with css/Sass in my projects.<br />
<br />
It monitors changes in your file system. When you change the (css or Sass) file, the connected web browser is refreshed. So I don’t have to do manual browser refresh after every change in my stylesheets.<br />
<br />
<br />
And that's all for today and I hope you now enjoy Sass in your Dart project! :-)Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com1Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-73754396738790680072015-10-29T15:41:00.000+01:002015-11-05T13:12:07.304+01:00DevFest Ukraine 2015This year I and my friend <a href="https://twitter.com/skvaros">Jakub Škvára</a> were invited as speakers to <a href="https://devfest.gdg.org.ua/">DevFest Ukraine 2015</a>. I watched their event on social networks last year and when I got an invitation to speak there this year, I was really super happy and made a proposal for both Dart talk and a Code Lab.<br />
<br />
DevFest Ukraine 2015 took place on October 23 - 24 in Lviv. Because there is no direct flight from Prague to Lviv, we had to transfer in Warsaw. Everything went fine and we successfully arrived to Lviv the evening before. Organizers prepared for us a special city tour around the city center and we heard a lot about Ukrainian history and saw a lot of Lviv's historical beauty.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-70rZUNG-_9c/VjIKzytK_lI/AAAAAAAAI4A/47G3QgFXDmQ/s1600/IMG_20151024_140720-EFFECTS.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="295" src="http://2.bp.blogspot.com/-70rZUNG-_9c/VjIKzytK_lI/AAAAAAAAI4A/47G3QgFXDmQ/s400/IMG_20151024_140720-EFFECTS.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Lviv's beauty according to Google Photos</td></tr>
</tbody></table>
<br />
<h2>
<span style="font-size: large;">Talks</span></h2>
The event started next morning with the keynote followed by talks in three parallel tracks: Android, Web & Cloud and community. And there were <b>40 sessions</b> during the whole event!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://3.bp.blogspot.com/-WSJh7jObas4/VjIMNPKmUxI/AAAAAAAAI4Q/gHfG1ybpGXU/s1600/IMG_20151022_101125.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="295" src="http://3.bp.blogspot.com/-WSJh7jObas4/VjIMNPKmUxI/AAAAAAAAI4Q/gHfG1ybpGXU/s400/IMG_20151022_101125.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">DevFest Ukraine 2015 just started!</td></tr>
</tbody></table>
<br />
<br />
I and Jakub both had talks on Friday and code labs/workshops on Saturday. I had a talk with name <b><a href="https://devfest.gdg.org.ua/#!/schedule/115">Let's play Dart!</a></b> where I talked about why I <b>love</b> Dart and why working with it makes me so much <b>happy</b> and <b>productive</b> developer. You can take a look at my slides on <a href="http://www.slideshare.net/Janamou/lets-play-dart">Slideshare</a>:<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="355" scrolling="no" src="//www.slideshare.net/slideshow/embed_code/key/yO4xwk8ULrCOf3" style="border-width: 0; display: block; margin: 0 auto; max-width: 100%;" width="425"> </iframe> <br />
<br />
<br />
Jakub had a talk about <a href="https://devfest.gdg.org.ua/#!/schedule/116"><b>Polymer vs other libraries</b></a>. During his talk he compared <b>Polymer</b> elements with components from <b>React</b> and <b>Angular</b> and showed us lots of examples.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/-mheehn6pJLE/VjISETUMBbI/AAAAAAAAI4c/obK3gBCJyfI/s1600/IMG_20151022_140826.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="237" src="http://1.bp.blogspot.com/-mheehn6pJLE/VjISETUMBbI/AAAAAAAAI4c/obK3gBCJyfI/s400/IMG_20151022_140826.jpg" width="400" /></a></div>
<br />
<br />
You can also take a look at his slides on <a href="http://www.slideshare.net/jskvara/polymer-vs-other-libraries-devfest-ukraine-2015">Slideshare</a>:<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="355" scrolling="no" src="//www.slideshare.net/slideshow/embed_code/key/tXwWBoynDM5CSg" style="border: 0; display: block; margin: 0 auto; max-width: 100%;" width="425"> </iframe>
<br />
<br />
<br />
During the day there was a lots of great talks about Android, Angular, Firebase <a href="https://devfest.gdg.org.ua/#!/schedule">and more</a>.<br />
<br />
You could also taste <b>Marshmallows</b>:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-7VQAcZIz3QE/VjIUS_-eYwI/AAAAAAAAI4o/mrHuBuMI9z8/s1600/IMG_20151022_093844.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="http://2.bp.blogspot.com/-7VQAcZIz3QE/VjIUS_-eYwI/AAAAAAAAI4o/mrHuBuMI9z8/s400/IMG_20151022_093844.jpg" width="295" /></a></div>
<br />
<br />
Or <b>all Android</b> versions:<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-2NGCK8fzAPo/VjIUwKEr-BI/AAAAAAAAI4w/h81HjmjPLWM/s1600/IMG_20151022_152914.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="295" src="http://1.bp.blogspot.com/-2NGCK8fzAPo/VjIUwKEr-BI/AAAAAAAAI4w/h81HjmjPLWM/s400/IMG_20151022_152914.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">All Android versions to eat ♥</td></tr>
</tbody></table>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-IC75CAVJ9JU/VjIVW5kJ5AI/AAAAAAAAI44/hzjKId-xaZg/s1600/IMG_20151022_145024.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="295" src="http://2.bp.blogspot.com/-IC75CAVJ9JU/VjIVW5kJ5AI/AAAAAAAAI44/hzjKId-xaZg/s400/IMG_20151022_145024.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">More Androids!</td></tr>
</tbody></table>
<br />
<br />
The first day ended with a great afterparty!<br />
<h2>
<span style="font-size: large;"><br /></span></h2>
<h2>
<span style="font-size: large;">Code Labs</span></h2>
The next day you could see also a lots of <a href="https://devfest.gdg.org.ua/#!/schedule">talks and Code Labs</a>. But for me and Jakub it was mostly a Code Lab day.<br />
<br />
We both had our Code Labs after the lunch. I started with mine about <a href="https://devfest.gdg.org.ua/#!/schedule/131">Your first server-side application in Dart</a> in which you could create a simple RESTful API with all speakers and sessions from the conference using the Dart's powerful (and really easy to use) <a href="https://pub.dartlang.org/packages/rpc">rpc</a> library and Jakub had a Code Lab about creating a <a href="https://devfest.gdg.org.ua/#!/schedule/130">Polymer front-end application</a> for this API.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-8CTK4M4UlyQ/VjIZFjTU2nI/AAAAAAAAI5E/CDbv7rhjfQc/s1600/IMG_20151023_152132.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="295" src="http://2.bp.blogspot.com/-8CTK4M4UlyQ/VjIZFjTU2nI/AAAAAAAAI5E/CDbv7rhjfQc/s400/IMG_20151023_152132.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart Code Lab!</td></tr>
</tbody></table>
<br />
You can find both our Code Labs on Github:<br />
<br />
<ul>
<li><b>Dart server-side Code Lab</b>: <a href="https://github.com/Janamou/dart-server-codelab">https://github.com/Janamou/dart-server-codelab</a></li>
<li><b>Let's build a new Polymer application</b>: <a href="https://github.com/jskvara/polymer-workshop-lviv">https://github.com/jskvara/polymer-workshop-lviv</a></li>
</ul>
<br />
I am planning to update my Code Lab soon a little, probably with integration to App Engine and a client-side app.<br />
<br />
<br />
<h2>
<span style="font-size: large;">Summary</span></h2>
I am really happy that I could be part of a great DevFest Ukraine 2015. The event was nicely organized, had a great atmosphere and organizers were always helpful and took care about us really nicely. We had also a lot of fun with other speakers and organizers and we could taste a local food and beer in nice restaurants.<br />
<br />
I definitely recommend going to DevFest Ukraine next year!<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-ck3LPd6odFQ/VjIbviP8MgI/AAAAAAAAI5Q/aPgpSx2brFY/s1600/IMG_20151023_181645.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="295" src="http://4.bp.blogspot.com/-ck3LPd6odFQ/VjIbviP8MgI/AAAAAAAAI5Q/aPgpSx2brFY/s400/IMG_20151023_181645.jpg" width="400" /></a></div>
<br />
<br />
Next month I am looking forward to <a href="https://devfest2015.gdgsv.com/">DevFest Silicon Valley 2015</a> and next? ... ;-)<br />
<br />
And the last photo from Ukraine's Lviv:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-TuOpcPg5ThE/VjIv45PVD4I/AAAAAAAAI5c/99LuUPj0mPI/s1600/PANO_20151024_140736.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="160" src="http://3.bp.blogspot.com/-TuOpcPg5ThE/VjIv45PVD4I/AAAAAAAAI5c/99LuUPj0mPI/s400/PANO_20151024_140736.jpg" width="400" /></a></div>
<br />
<br />Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-42810187604461005542015-09-24T14:43:00.000+02:002015-11-05T13:10:53.935+01:00Dartdoc: Generate a nice documentation for your Dart packageWe developers <i>love</i> creating code. But this is not only about writing actual code but, for example, also about writing documentation for your code. Now you can say that code should be <i>self-documenting</i>. Which definitely should be but this is not everything.<br />
<br />
Writing documentation for your code gives you a lot of benefits and it should be part of your daily coding job.<br />
<br />
<h2>
<span style="font-size: large;">Documentation and Dart</span></h2>
There is a really nice article about <a href="https://www.dartlang.org/articles/doc-comment-guidelines/">writing documentation</a> in your Dart projects and this my blog post will show you how to benefit from your documented Dart code.<br />
<br />
Dart has a tool for generating <b>nice HTML documentation</b> for your Dart package. The latest Dart version - Dart 1.12 came with a new version of this tool, now called <span style="font-family: "courier new" , "courier" , monospace;">dartdoc</span><span style="font-family: inherit;">, which </span>replaces the old <span style="font-family: "courier new" , "courier" , monospace;">docgen</span> tool.<br />
<br />
Dartdoc generates a nice HTML documentation for your package easily and very fast. And it also looks really nice.<br />
<br />
<h2>
<span style="font-size: large;">How to run dartdoc?</span></h2>
Simply run <span style="font-family: "courier new" , "courier" , monospace;">dartdoc</span> tool from the root directory of your package.<br />
<br />
<pre class="brush: bash">dartdoc</pre>
<br />
Just that simple. No extra parameters needed.<br />
<br />
And now watch how it generates a nice documentation into a <span style="font-family: "courier new" , "courier" , monospace;">doc</span> folder in your project. Then just simply open the <span style="font-family: "courier new" , "courier" , monospace;">doc/api/index.html</span> file in your web browser and <i>tadaaa</i>, you can explore your documentation :-) Nicely generated documentation available really fast.<br />
<br />
For a usage information about the command add <span style="font-family: "courier new" , "courier" , monospace;">-h</span> or <span style="font-family: "courier new" , "courier" , monospace;">--help</span> option:<br />
<br />
<pre class="brush: bash">dartdoc --help
Generate HTML documentation for Dart libraries.
Usage: dartdoc [OPTIONS]
-h, --help Show command help.
--version Display the version for dartdoc.
--dart-sdk Location of the Dart SDK. Use if SDK isn't automatically located.
--sdk-docs Generate ONLY the docs for the Dart SDK.
--sdk-readme Path to the SDK description file. Use if generating Dart SDK docs.
--input Path to source directory
(defaults to "/Users/janamou/Projects/my_super_project")
--output Path to output directory.
(defaults to "doc/api")
--header path to file containing HTML text, inserted into the header of every page.
--footer path to file containing HTML text, inserted into the footer of every page.
--package-root The path to the package root.
--url-mapping --url-mapping=libraryUri,/path/to/library.dart directs dartdoc to use "library.dart" as the source for an import of "libraryUri"
--exclude Comma-separated list of library names to ignore.
--include Comma-separated list of library names to generate docs for.
--hosted-url URL where the docs will be hosted (used to generate the sitemap).
</pre>
<br />
Dartdoc tool is also available on <a href="https://github.com/dart-lang/dartdoc">Github</a> so if you find any issue with it, you can simply report it. Or you can <a href="https://github.com/dart-lang/dartdoc/blob/master/CONTRIBUTING.md">contribute</a> to the project.<br />
<br />
<h2>
<span style="font-size: large;">Dartdoc in action</span></h2>
If you want to see new dartdoc already in action, take a look at the official <a href="https://api.dartlang.org/133699/index.html">Dart SDK API documentation</a>. Browse through it. Nice isn't it?<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-vsSGBykf96A/VgPmWBOQEPI/AAAAAAAAIZI/1ZIIlo1pLwk/s1600/dartdoc.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="" border="0" height="411" src="http://3.bp.blogspot.com/-vsSGBykf96A/VgPmWBOQEPI/AAAAAAAAIZI/1ZIIlo1pLwk/s640/dartdoc.png" title="" width="640" /></a></div>
<br />
<br />
Have you already tried dartdoc? Is generating of documentation part of your workflow?<br />
<br />
Se ya soon again!Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-25544938364158979722015-05-14T16:12:00.000+02:002015-11-05T13:12:43.278+01:00Dart Developer Summit: Awesome two days spent with DartisansThe first <a href="https://www.dartlang.org/events/2015/summit/">Dart Developer Summit</a> took place in San Francisco's Google office at the end of April 2015 and it was two days full of <b>Dart awesomeness</b>! In this blog post I summarize my feelings from the first Dart oriented summit.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-ER3bB23Suws/VVP1NICs2fI/AAAAAAAAEQI/get8gel25lc/s1600/dartsummit.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="223" src="http://2.bp.blogspot.com/-ER3bB23Suws/VVP1NICs2fI/AAAAAAAAEQI/get8gel25lc/s400/dartsummit.png" width="400" /></a></div>
<br />
<br />
<br />
<h2>
<span style="font-size: large;">Dart Code Lab</span></h2>
The evening before summit I led the 4 hour <a href="https://www.eventbrite.com/e/dart-code-lab-tickets-16104627374">Dart Code Lab</a>. Attendees had the opportunity to play with Dart through <a href="https://www.dartlang.org/codelabs/darrrt/">client-side</a> and/or new <a href="https://www.dartlang.org/codelabs/server/">server-side</a> code lab, talk and get direct help from Dart engineers and see demos of some Dart projects.<br />
<br />
I am really happy that I could spend nice evening with lots of Dartisans, talk with them and share my enthusiasm... about Dart :-D.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-7k1ay4-qwSc/VVPSEeH6OxI/AAAAAAAAEO4/TLZkoaDCqd4/s1600/dart-codelab-photos.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-7k1ay4-qwSc/VVPSEeH6OxI/AAAAAAAAEO4/TLZkoaDCqd4/s640/dart-codelab-photos.png" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Photos by <a href="https://twitter.com/FaisalAbid/status/592879071614390272">Faisal Abid</a></td></tr>
</tbody></table>
<br />
<br />
If you haven't seen the new server-side code lab yet, I definitely recommend to <a href="https://www.dartlang.org/codelabs/server/">take a look</a>! The code lab will help you to dive into Dart on server-side using the new <a href="https://pub.dartlang.org/packages/rpc">RPC package</a> really quickly.<br />
<br />
<br />
<h2>
<span style="font-size: large;">Dart Developer Summit</span></h2>
Two days long summit with all about Dart full of talks, networking and more.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://4.bp.blogspot.com/-CyJ2tAEh8SA/VVPjU-gOm8I/AAAAAAAAEPI/PKj7ER5Vrzs/s1600/dart_cake.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="http://4.bp.blogspot.com/-CyJ2tAEh8SA/VVPjU-gOm8I/AAAAAAAAEPI/PKj7ER5Vrzs/s320/dart_cake.jpg" width="308" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart cake!</td></tr>
</tbody></table>
<br />
<br />
The summit started with a <b><a href="https://www.youtube.com/watch?v=FiXiI2Atexc">Keynote: Dart Today and Tomorrow</a></b>, where Dart co-founders Lars Bak and Kasper Lund highlighted motivation behind Dart, talked about topics such as Dart on Mobile and showed us the nearest <b>Dart SDK roadmap</b>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-gRkYnwZ7Vis/VVPo57iBU2I/AAAAAAAAEPg/C9aLKTx005I/s1600/sdk_roadmap.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-gRkYnwZ7Vis/VVPo57iBU2I/AAAAAAAAEPg/C9aLKTx005I/s640/sdk_roadmap.png" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart SDK roadmap</td></tr>
</tbody></table>
<br />
<br />
On what we can look forward to? <a href="https://github.com/dart-lang/fletch">Fletch</a>, Dart Mobile Services, <a href="https://github.com/dart-lang/dev_compiler">Dev Compiler</a>, <b>Dart SDK 2.0</b>. Yep, and WebStorm becomes <a href="http://news.dartlang.org/2015/04/the-present-and-future-of-editors-and.html">preferred IDE for Dart</a>. Time to move out from the Dart editor.<br />
<br />
And then the summit continued with talks from both Dart software engineers and other developers using Dart every day.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://4.bp.blogspot.com/-qES4hjGWJZU/VVPwo3KtSNI/AAAAAAAAEPw/Q0i_1wZMPTk/s1600/observatory.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://4.bp.blogspot.com/-qES4hjGWJZU/VVPwo3KtSNI/AAAAAAAAEPw/Q0i_1wZMPTk/s640/observatory.jpg" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://www.dartlang.org/tools/observatory/">Observatory</a> tool</td></tr>
</tbody></table>
<br />
<br />
We heard how to use <a href="https://www.youtube.com/watch?v=MUDOIAssBDs">Async in Dart</a> (love <span style="font-family: "courier new" , "courier" , monospace;">async</span>/<span style="font-family: "courier new" , "courier" , monospace;">await</span> and definitely recommend using it, I wrote about it in my <a href="http://www.moudra.net/2015/03/tour-of-last-weeks-news-in-dartiverse.html">previous blog post</a>), <a href="https://www.youtube.com/watch?v=y39pZCExsOs">Observatory</a> (I need to explore this powerful tool more deeply!), <a href="https://www.youtube.com/watch?v=kazpTc75-Bg">Reflection</a>, <a href="https://www.youtube.com/watch?v=xneWkyKLuk0">Dart2js</a>, external developers talking about <a href="https://www.youtube.com/watch?v=4O4jr0tr_ow">switching to Dart</a> and more.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-ga5uNndCRh4/VVPyVZ2sE5I/AAAAAAAAEP8/_-97DItaCpM/s1600/syodlajs.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-ga5uNndCRh4/VVPyVZ2sE5I/AAAAAAAAEP8/_-97DItaCpM/s640/syodlajs.jpg" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://www.youtube.com/watch?v=2Ef3ALvbkhA">Dart for the Web</a> - SYODLAJS = Ship your own Dart Library as JavaScript</td></tr>
</tbody></table>
<br />
<br />
And the summit was not only about talks! It was also about <b>networking</b> and <b>meeting</b> other developers.<br />
<br />
There were <b>tons</b> of Dart software engineers prepared to talk with you and help. Part of the schedule were also special <b>breakouts sessions</b> in which we were divided into smaller groups interested in some topic we proposed and voted for before (such as testing, Observatory, server-side,...) and then we discussed that particular topic.<br />
<br />
The first day ended with <b>lightning talks</b> about not only Dart related topics (but the lightning talks are always fun).<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-eNSDcIOIJx4/VVP8MUlggQI/AAAAAAAAEQc/X7ufKlTTk-U/s1600/dart_for_mobile.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://2.bp.blogspot.com/-eNSDcIOIJx4/VVP8MUlggQI/AAAAAAAAEQc/X7ufKlTTk-U/s640/dart_for_mobile.jpg" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://www.youtube.com/watch?v=t8xdEO8LyL8">Dart for Mobile</a></td></tr>
</tbody></table>
<br />
<br />
Next day we heard talks such as how the <a href="https://www.youtube.com/watch?v=Bh8tugWZsP8">Google Ads team</a> is using Dart (and makes their developers and users happy), moving from <a href="https://www.youtube.com/watch?v=NHsmiY0rFS8">Node.js to Dart</a>, and two Dart on Mobile talks: <a href="https://www.youtube.com/watch?v=t8xdEO8LyL8">Dart for Mobile</a> and <a href="https://www.youtube.com/watch?v=PnIWl33YMwA">Sky project</a>. Pure awesomeness!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-zNUnEW-yo7k/VVP9BmdHmlI/AAAAAAAAEQk/mNvCqUe-GHU/s1600/sky.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-zNUnEW-yo7k/VVP9BmdHmlI/AAAAAAAAEQk/mNvCqUe-GHU/s640/sky.jpg" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://github.com/domokit/sky_sdk">Sky experiment</a>: No Java, just Dart...</td></tr>
</tbody></table>
<br />
<br />
And finally there was also a <a href="https://www.youtube.com/watch?v=hYt9lhMie-o">panel discussion</a> as a part of a schedule. You asked questions, engineers answered. So interesting and fun!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://4.bp.blogspot.com/-w3tacmur1Xw/VVQCMrfhNvI/AAAAAAAAEQ0/USz0HawiNfA/s1600/panel_discussion.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://4.bp.blogspot.com/-w3tacmur1Xw/VVQCMrfhNvI/AAAAAAAAEQ0/USz0HawiNfA/s640/panel_discussion.jpg" width="520" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Fun on panel discussion</td></tr>
</tbody></table>
<br />
<br />
You can find all the videos from talks at Dart summit online in <a href="https://www.youtube.com/playlist?list=PLOU2XLYxmsIIQorIS8gagUiMau9S84vZV">this play list</a>.<br />
<br />
<b>The Dart Developer Summit was really great event where you could learn a lot new about Dart, share same interests with developers from different parts of the world, meet Dart software engineers, talk with them and get help. I really hope that this event will also take place next year!</b><br />
<br />Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-55795962637256404742015-03-31T16:40:00.001+02:002015-03-31T16:40:27.377+02:00Tour of last week's news in Dartiverse<br />
Last week was <b>really rich</b> in <a href="http://news.dartlang.org/">official news</a> from Dart. In this blog post, I will summarize the things that happened last week in Dartiverse and yes, lots of things happened! Are you prepared?<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<img border="0" src="http://3.bp.blogspot.com/-ZqXzf9e26GE/VRn5tUjkwjI/AAAAAAAAEHk/pRBp6VF7oLY/s1600/news_dartiverse.png" height="126" style="border: none; box-shadow: none;" width="400" /></div>
<br />
<br />
<h2>
<span style="font-size: large;">REST API with Dart</span></h2>
Dart team released <a href="http://news.dartlang.org/2015/03/create-your-own-rest-api-with-dart.html">RPC package</a> for creating <b>RESTful server-side Dart APIs. </b>Yay! This package will help you with data serialization and routing of requests.<br />
<br />
Projects which are using RPC package at the moment are <a href="https://github.com/dart-lang/dart-services">DartPad</a> and <a href="https://github.com/GoogleCloudPlatform/appengine-dart-todos">TodoMVC</a>, both are on Github. You can read how to use this package and download it either on <a href="https://pub.dartlang.org/packages/rpc">pub</a> or on <a href="https://github.com/dart-lang/rpc">Github</a>.<br />
<br />
<h2>
<span style="font-size: large;">Dart for the Entire Web</span></h2>
These were really important news for the community. Dart team decided <a href="http://news.dartlang.org/2015/03/dart-for-entire-web.html">not to integrate the Dart VM</a> into Chrome and they are focusing on better <b>compilation into the JavaScript</b>. This makes sense to me because Chrome is not the only one browser on the entire world so the Dart application has to be always compiled into the JavaScript.<br />
<br />
And what do we want? Why we are using Dart? We want to be more <i>productive</i>, have the possibility to use <i>great tools</i> and <i>libraries</i>. And this is exactly what Dart brings to us, we are not losing anything from that. So for us, developers, there is no change. But imagine even better tools, server side and <b>Dart on mobile</b>. And these are exactly the things they are working on now.<br />
<br />
I am really looking forward to the <a href="https://www.dartlang.org/events/2015/summit/">Dart summit</a> because lots of these topics will be covered in <b>Dart Summit speeches</b>.<br />
<br />
And finally. <b>Google Ads is using Dart</b>. With million lines of Dart code - this is great!<br />
<br />
<h2>
<span style="font-size: large;">async, async*, </span><span style="font-size: large;">await, yield...</span></h2>
These mysterious words deserve more attendance. They are really powerful because they make you more productive.<br />
<br />
Have you read <a href="https://www.dartlang.org/articles/await-async/">this article</a> about using <span style="font-family: Courier New, Courier, monospace;">async</span> and <span style="font-family: Courier New, Courier, monospace;">await</span>? No? <b>Well, you really should</b>. Take a look at this small example.<br />
<br />
Instead of this:<br />
<br />
<pre class="brush: java">HttpRequest.getString("animals.json")
.then(feedAnimals);</pre>
<br />
you can now write this:<br />
<br />
<pre class="brush: java">feedAnimals(await HttpRequest.getString("animals.json"));</pre>
<br />
But it is not now only about <span style="font-family: Courier New, Courier, monospace;">async</span> and <span style="font-family: Courier New, Courier, monospace;">await</span>. We have more power in our hands! <span style="font-family: Courier New, Courier, monospace;">async*</span>, <span style="font-family: Courier New, Courier, monospace;">sync*</span>, ... <b>Take a look at</b> the second article about new <a href="https://www.dartlang.org/articles/beyond-async/">Dart language asynchrony support</a>.<br />
<br />
<h2>
<span style="font-size: large;">Dart 1.9</span></h2>
<a href="http://news.dartlang.org/2015/03/dart-19-release-youve-been-await-ing-for.html"><b>Dart 1.9</b></a> is probably one of the biggest releases after 1.0 and it was really worth waiting for. With 1.9 you can try the new <b>Dart language asynchrony support</b> and full support of <b>enums</b>.<br />
<br />
I can't also forget the <a href="https://github.com/dart-lang/dart_style">awesome formatter</a>, which is now integrated into <b><a href="https://www.dartlang.org/tools/dartfmt/">dartfmt</a></b> tool and that's not all. You can read more news about 1.9 in the <a href="https://groups.google.com/a/dartlang.org/forum/#!topic/announce/5phqw_mraGA/discussion">release notes</a>.<br />
<br />
Soooo. Have you already tried <span style="font-family: Courier New, Courier, monospace;">async</span> and <span style="font-family: Courier New, Courier, monospace;">await</span> in your code?<br />
<br />
<b>Happy coding!</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-38150148625279137352015-03-18T15:33:00.000+01:002015-03-18T15:33:59.796+01:00I would like a sortable list for my Dart application, please.I remember my <a href="http://www.commitstrip.com/en/2015/02/11/the-day-i-abandoned-jquery/">days with jQuery</a>. When I wanted to implement for example <b>sortable list</b>, I searched on Google for some plugin, included jQuery and the plugin, initialized it and it worked. And now I am working on some Dart application where I would love to have sortable list, so I have to <i>implem...</i><br />
<br />
OMG, wait! No, I don't have to!<br />
<br />
My goal is to have a list (usually <span style="font-family: Courier New, Courier, monospace;">ul</span><span style="font-family: Arial, Helvetica, sans-serif;"> </span>- <span style="font-family: Courier New, Courier, monospace;">li</span><span style="font-family: inherit;"> elements</span>) with a possibility to reorder list items with <i>drag and drop</i>. In this blog post I will take a look at some libraries which interested me on <a href="https://pub.dartlang.org/">pub</a>.<br />
<br />
The libraries are <b>assortment </b>and <b>dnd</b>.<br />
<br />
<h2>
<span style="font-size: large;">assortment</span></h2>
<b>assortment </b>is a simple library, which can create a sortable list. Library is really easy to use, you just add import for the library:<br />
<br />
<pre class="brush: java">import 'package:assortment/assortment.dart';</pre>
<br />
Create an <span style="font-family: Courier New, Courier, monospace;">ul</span><span style="font-family: inherit;"> - </span><span style="font-family: Courier New, Courier, monospace;">li</span> list in HTML:<br />
<br />
<pre class="brush: xml"><ul id="sortable-list">
<li>Red</li>
<li>Green</li>
<li>Blue</li>
</ul>
</pre>
<br />
Then you need to create new <span style="font-family: Courier New, Courier, monospace;">Assortment</span><span style="font-family: inherit;"> </span>object with retrieved <span style="font-family: Courier New, Courier, monospace;">ul</span><span style="font-family: inherit;"> </span>list as a parameter and then it is needed to add it retrieved children - <span style="font-family: Courier New, Courier, monospace;">li</span> elements.<br />
<br />
<pre class="brush: java">Assortment assortment = new Assortment(querySelector('#sortable-list'));
assortment.addElements(querySelectorAll('#sortable-list li'));</pre>
<br />
Usually you also want to do something after the change in the list (for example update model) so you can listen for prepared events from <span style="font-family: Courier New, Courier, monospace;">assortment</span>:<br />
<ul>
<li><span style="font-family: Courier New, Courier, monospace;">onDragStart</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragEnter</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragEnd</span></li>
</ul>
<span style="font-family: Courier New, Courier, monospace;"><br /></span>
<span style="font-family: Courier New, Courier, monospace;">AssortmentEvent </span>allows you to get the event and elements which participated in reorder.<br />
<br />
For example:<br />
<pre class="brush: java">assortment.onDragEnd.listen((AssortmentEvent event) {
print("onDragEnd fired!");
});</pre>
<br />
That's it! You have a simple drag and drop sortable list. The library works with any elements, so you can normally use <span style="font-family: Courier New, Courier, monospace;">div </span>elements instead of <span style="font-family: Courier New, Courier, monospace;">ul</span><span style="font-family: inherit;"> - </span><span style="font-family: Courier New, Courier, monospace;">li</span> list.<br />
<br />
And finally, you can find this library on <a href="https://pub.dartlang.org/packages/assortment">pub</a> and <a href="https://github.com/sirctseb/assortment">Github</a>.<br />
<br />
<br />
<h2>
<span style="font-size: large;">dnd: Dart Drag and Drop</span></h2>
Library <b>Dart Drag and Drop</b> allows you to work with drag and drop in whatever way you can imagine. You can create basic draggable object, free dragging object, dragging object using horizontal or vertical axis and more! It also supports creating of sortable lists which was the thing, I wanted.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://4.bp.blogspot.com/-SVDv4mh8qOQ/VQlZWD--JMI/AAAAAAAAEAM/M6H51QV6syc/s1600/dnd-screenshot.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://4.bp.blogspot.com/-SVDv4mh8qOQ/VQlZWD--JMI/AAAAAAAAEAM/M6H51QV6syc/s1600/dnd-screenshot.png" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">http://code.makery.ch/library/dart-drag-and-drop/</td></tr>
</tbody></table>
<br />
For more demos of this library take a look at the <a href="http://code.makery.ch/library/dart-drag-and-drop/">official website</a>.<br />
<br />
How to create sortable list? Import the library:<br />
<br />
<pre class="brush: java">import 'package:dnd/dnd.dart';</pre>
<br />
Then create <span style="font-family: Courier New, Courier, monospace;">Draggable</span><span style="font-family: inherit;"> </span>and <span style="font-family: Courier New, Courier, monospace;">Dropzone</span><span style="font-family: inherit;"> </span>object with <span style="font-family: Courier New, Courier, monospace;">AvatarHandler</span><span style="font-family: inherit;"> </span>(this ensures visual feedback during dragging) which are using the retrieved <span style="font-family: Courier New, Courier, monospace;">li</span> elements.<br />
<br />
<pre class="brush: java">Draggable draggable = new Draggable(querySelectorAll('#sortable-list li'),
avatarHandler: new AvatarHandler.clone());
Dropzone dropzone = new Dropzone(querySelectorAll('#sortable-list li'));</pre>
<br />
And finally define <span style="font-family: Courier New, Courier, monospace;">onDrop</span> event on <span style="font-family: Courier New, Courier, monospace;">dropzone</span>:<br />
<br />
<pre class="brush: java">dropzone.onDrop.listen((DropzoneEvent event) {
swapElements(event.draggableElement, event.dropzoneElement);
});</pre>
<br />
<span style="font-family: Courier New, Courier, monospace;">swapElements()</span> is your implementation of changing position of elements in the list. For example take a look at the <a href="https://github.com/marcojakob/dart-dnd/blob/master/example/simple-sortable/web/example.dart">official example</a> but your implementation can be different.<br />
<br />
It is also possible to listen to different types of events for both objects.<br />
<br />
<span style="font-family: Courier New, Courier, monospace;">Draggable</span><span style="font-family: inherit;"> </span>object:<br />
<ul>
<li><span style="font-family: Courier New, Courier, monospace;">onDrag</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragStart</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragEnd</span></li>
</ul>
<br />
<span style="font-family: Courier New, Courier, monospace;">Dropzone</span><span style="font-family: inherit;"> </span>object:<br />
<ul>
<li><span style="font-family: Courier New, Courier, monospace;">onDrop</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragEnter</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragOver</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">onDragLeave</span></li>
</ul>
<br />
And that's also it. I really recommend to go through <a href="http://code.makery.ch/library/dart-drag-and-drop/">all the examples</a> because this library can do <b>lots of things</b>. And a big plus is, that the list also works on mobile. You can use it also with <span style="font-family: Courier New, Courier, monospace;">div </span>elements and the library is available on <a href="https://pub.dartlang.org/packages/dnd">pub</a> and <a href="https://github.com/marcojakob/dart-dnd">Github</a>.<br />
<br />
That's all for today. I really like both of these libraries and I think that they can help a lot. Have you tried any of these libraries?<br />
<br />
<b>Happy Dart coding! :-)</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-80447908412628252062015-02-19T15:59:00.000+01:002015-02-19T16:04:19.594+01:00Dart Designer: Diagrams for your Dart applicationRecently I wanted to create diagrams for some Dart application and was curious if there exists some tool dedicated directly to Dart. And after some searching I found <a href="http://dartdesigner.github.io/" style="font-weight: bold;">Dart Designer</a><b> </b>which is available on <a href="https://github.com/dartdesigner/Dart-Designer">Github</a>.<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-sBMK5trc4pQ/VOWgTLBdDrI/AAAAAAAADxw/KZLZKcIffUk/s1600/dart_designer.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-sBMK5trc4pQ/VOWgTLBdDrI/AAAAAAAADxw/KZLZKcIffUk/s1600/dart_designer.png" height="135" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">http://dartdesigner.github.io/</td></tr>
</tbody></table>
<div>
<br />
<h2>
<span style="font-size: large;"><br /></span></h2>
<h2>
<span style="font-size: large;">Dart Designer</span></h2>
Dart Designer is the graphical tool based on Eclipse which helps you with creating diagrams like package diagram, class diagram and more. It comes with integrated Dart Editor so you can also develop in it.<br />
<br />
To start working on diagrams you just need to create a new <i>Dart Designer Project</i> and then you can start working on diagrams. Dart Designer also knows Dart language features like Mixins.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-7JFNXJJ8MH8/VOXjSkZW16I/AAAAAAAADyA/V6wVlUMDbl0/s1600/dart-diagram.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="" border="0" src="http://2.bp.blogspot.com/-7JFNXJJ8MH8/VOXjSkZW16I/AAAAAAAADyA/V6wVlUMDbl0/s1600/dart-diagram.png" height="298" title="" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">This is how you create class diagram in Dart Designer</td></tr>
</tbody></table>
<br />
To explore how to use the designer, I recommend to take a look at the official <a href="https://www.youtube.com/watch?v=CCbhPVMYZ30#t=128">video</a>.<br />
<br />
Dart Designer looks like a great tool for creating diagrams because it <i>knows </i>Dart. The only thing I am missing, is the possibility to create diagram from existing Dart code and vice versa.<br />
<br />
Happy Dart diagramming! :-)</div>
Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-33739599068092016002015-02-04T15:42:00.000+01:002015-02-19T14:56:45.350+01:00Happy to be Dart Google Developer Expert!It's a big pleasure for me to say, that I recently became <b><a href="https://developers.google.com/experts/people/jana-moudr">Google Developer Expert</a></b> (GDE) for Dart language.<br />
<br />
<h2>
<span style="font-size: large;">
Who are the Google Experts?</span></h2>
Shortly said:<br />
<blockquote class="tr_bq" style="margin-left: 15px;">
<i>Google Experts are a global network of experienced product strategists, designers, developers and marketing professionals actively supporting developers, startups and companies changing the world through web and mobile applications.</i></blockquote>
You can read more about them on site: <a href="https://developers.google.com/experts/about">https://developers.google.com/experts/about</a><br />
<br />
<h2>
<span style="font-size: large;">What does this mean to me?</span></h2>
Besides of developing in Dart I really love meeting and helping to other developers so I will continue helping the community.<br />
<br />
I have some experience with co-organizing Dart related events like <a href="http://www.moudra.net/2014/11/how-we-did-dart-and-polymerdart-code.html">code labs</a> (to learn Dart), <a href="http://www.moudra.net/2014/10/dart-polymer-hackathon-prague-2014.html">hackathons</a> (to code and have fun with Dart) and I love <a href="http://www.slideshare.net/Janamou/dart-darrt-darrrt">talking about Dart</a>. So if you plan to do some Dart related event and want to help or you are looking for speaker, don't hesitate to contact me! :-)Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999850.0755381 14.43780049999998 50.0755381 14.43780049999998tag:blogger.com,1999:blog-4409514803331315462.post-81877196496155365642015-01-20T02:38:00.001+01:002015-07-01T01:48:10.001+02:00dart_style: How to make your Dart code even betterRecently I noticed a package <a href="https://pub.dartlang.org/packages/dart_style">dart_style</a> which helps you have your code according to the <a href="https://www.dartlang.org/articles/style-guide/">Dart Style Guide</a>.<br />
<br />
It is a <b>formatter/linter for Dart</b> code which you can run on desired files from the command line. It then outputs formatted code directly to the command line or you can let overwrite existing files with formatted code.<br />
<br />
Update: dart_style package is a new Dart formatter <span style="font-family: Courier New, Courier, monospace;">dartfmt</span>!<br />
<br />
<h2>
<span style="font-size: large;">How to install?</span></h2>
<div>
We need to activate globally the package via the command in command line:<br />
<br />
<pre class="brush: bash">pub global activate dart_style</pre>
<br />
I personally use it directly from <a href="https://github.com/dart-lang/dart_style/">Github</a> to have always last (dev) version via the command: </div>
<br />
<pre class="brush: bash">pub global activate --source git https://github.com/dart-lang/dart_style.git</pre>
<br />
<h2>
<span style="font-size: large;">How to use?</span></h2>
And now the magic begins with the command <span style="font-family: 'Courier New', Courier, monospace;">dartfmt</span><span style="font-family: inherit;">. For example:</span><br />
<span style="font-family: inherit;"><br /></span>
<br />
<pre class="brush: bash">dartfmt index.dart</pre>
<br />
This outputs formatted <span style="font-family: Courier New, Courier, monospace;">index.dart</span> in the console. But usually I want to directly format all my files in the folder and overwrite my existing files with formatted code. The parameter <span style="font-family: Courier New, Courier, monospace;">-w</span> does this trick for me:<br />
<br />
<pre class="brush: bash">dartfmt -w lib</pre>
<br />
<span style="font-family: inherit;">This command goes through all the </span><span style="font-family: Courier New, Courier, monospace;">.dart</span><span style="font-family: inherit;"> files in the </span><span style="font-family: Courier New, Courier, monospace;">lib</span><span style="font-family: inherit;"> folder and tries to format them. In my case the output may look like this:</span><br />
<span style="font-family: inherit;"><br /></span>
<br />
<pre class="brush: bash">Formatting directory lib:
Unchanged controller.dart
Unchanged model\user.dart
...
Formatted view\app_view.dart
Formatted view\menu_view.dart
...
</pre>
<br />
And that's it! Your code should be now nicely formatted. And it is possible to use the formatter not only via the command line but also <a href="https://github.com/dart-lang/dart_style/#using-it-programmatically"><b>programmatically</b></a>.<br />
<br />
<b>Dart style formatter</b> is now one of my favourite tools used during Dart development and it helps me to have my code even better.<br />
<br />
<b>What do you think about Dart style formatter? Have you tried it?</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999850.0755381 14.43780049999998 50.0755381 14.43780049999998tag:blogger.com,1999:blog-4409514803331315462.post-67932592542943799762014-11-12T23:13:00.000+01:002015-02-19T14:58:11.159+01:00How we did Dart and Polymer.dart Code LabsLast Saturday me and <a href="http://www.jakubskvara.cz/">Jakub Škvára</a> participated in <a href="http://devfest.pl/">DevFest Kraków</a> as Code Labers for Dart and Polymer.dart. I am really happy that we had such opportunity to visit this event, meet other developers and finally visit Poland.<br />
<br />
We did this Code Labs after our Code Labs in Prague and we wanted to do them differently. We wanted to show some easy application in Dart and then rewrite it directly into Polymer.dart to show how easy and great it is. Each Code Lab was 1.5h long.<br />
<br />
<h2>
<span style="font-size: large;">Code Lab Applications</span></h2>
So we did two simple Note-taking applications, one in Dart using <span style="font-family: Courier New, Courier, monospace;">dart:html</span> library and Twitter Bootstrap for styles and the second one in Polymer.dart with Paper elements.<br />
<br />
Both Code Labs are available on Github divided into some steps.<br />
<br />
<h2>
<span style="font-size: small;">Dart Application</span></h2>
<div>
<span style="font-size: small;">Sources: </span><a href="https://github.com/Janamou/dart-codelab/">https://github.com/Janamou/dart-codelab/</a></div>
<div>
<span style="font-size: small;">Code Lab text: </span><a href="https://github.com/Janamou/dart-codelab/wiki">https://github.com/Janamou/dart-codelab/wiki</a></div>
<div>
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://4.bp.blogspot.com/-f6Up6cmfgD4/VGPKs1mVVdI/AAAAAAAADKc/UNl4Bes9p8U/s1600/notes_app.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="400" src="https://4.bp.blogspot.com/-f6Up6cmfgD4/VGPKs1mVVdI/AAAAAAAADKc/UNl4Bes9p8U/s400/notes_app.png" width="395" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Dart application</td></tr>
</tbody></table>
<br />
<h2>
<span style="font-size: small;">Polymer.dart Application</span></h2>
Sources and Code Lab text: <a href="https://github.com/jskvara/dart-polymer-code-lab-krakow">https://github.com/jskvara/dart-polymer-code-lab-krakow</a><br />
<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://3.bp.blogspot.com/-TfJ0NLwFxpY/VGPM6iUT7eI/AAAAAAAADKo/0_IsCzwMcLM/s1600/notes_app.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="216" src="https://3.bp.blogspot.com/-TfJ0NLwFxpY/VGPM6iUT7eI/AAAAAAAADKo/0_IsCzwMcLM/s400/notes_app.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Polymer.dart application</td></tr>
</tbody></table>
<br />
<h2>
<span style="font-size: large;">Code Lab best practices for future Code Labers :-)</span></h2>
Do you also plan to do some Code Lab? After our three Code Labs I can share some best practices which worked for us:<br />
<br />
<ol>
<li><b>Do a short presentation</b> before the actual Code Lab. Answer on these questions: What is it? Why/when to use it? How to use it?</li>
<li>Try to <b>code some basics</b> with people before the actual Code Lab: Let's code our first <span style="font-family: Courier New, Courier, monospace;">"Hello world!"</span>. Which value is in <span style="font-family: Courier New, Courier, monospace;">int count;</span><span style="font-family: inherit;">? How to write method/class/constructor/inheritance etc.?</span></li>
<li><span style="font-family: inherit;"><b>Ask people</b> if they have any problems or questions after each bigger step and help them solve it. Communicate with them.</span></li>
<li><span style="font-family: inherit;"><b>Have fun!</b> :-)</span></li>
</ol>
<br />
And finally, I am sharing some photo from beautiful night Kraków.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://4.bp.blogspot.com/--A355h4kGKM/VGPVs6DfX2I/AAAAAAAADK4/kCKhfiB0BQs/s1600/krakow.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://4.bp.blogspot.com/--A355h4kGKM/VGPVs6DfX2I/AAAAAAAADK4/kCKhfiB0BQs/s1600/krakow.png" /></a></div>
<br />
Beautiful, isn't It?Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-75530425359824991582014-10-27T01:41:00.003+01:002015-02-19T14:58:25.657+01:00Stagehand: Tool you want to use for your next Dart projectYesterday I found a great tool with name <a href="http://stagehand.pub/"><b>Stagehand</b></a>. I would say that this tool makes happy Dart developer even more happier. Stagehand helps you create a new Dart project easily with all the important things prepared.<br />
<br />
Yes, creating a new project with Dart Editor is <i>nice</i> but with Stagehand it is <i>awesome</i>. Creating a new project for me without Stagehand always involved searching wherever for the .gitignore file (if you do not know .<a href="http://gitignore.io/">gitignore.io</a>) and then searching for some libraries etc.<br />
<br />
With Stagehand you have everything important <b>prepared</b>.<br />
<br />
<h2>
<span style="font-size: large;">
How to install?</span></h2>
As a first thing you should update to the latest version of Dart SDK.<br />
<br />
And then run in the command line:<br />
<br />
<pre class="brush: bash">pub global activate stagehand</pre>
<br />
I had to also add some folder to the PATH on Windows. Then you are done. You can use it :-)<br />
<br />
<h2>
<span style="font-size: large;">How to use?</span></h2>
Using of Stagehand is really easy. When you are in the desired folder where you want to generate the project, just run:<br />
<br />
<pre class="brush: bash">stagehand <apptype></pre>
<br />
where the <span style="font-family: Courier New, Courier, monospace;">apptype</span> is:<br />
<ul>
<li><span style="font-family: Courier New, Courier, monospace;">consoleapp</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">package</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">polymerapp</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">shelfapp</span></li>
<li><span style="font-family: Courier New, Courier, monospace;">webapp</span></li>
</ul>
<br />
I will create a new web application project into my folder with command:<br />
<br />
<pre class="brush: bash">stagehand webapp</pre>
<br />
And then open the project in Dart Editor, run it and see, what Stagehand did.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-e-0gKXZZNgM/VE2Os8RlhJI/AAAAAAAACig/s2nMVs3JQI0/s1600/stagehand-web-template.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Stagehand web template" border="0" src="http://2.bp.blogspot.com/-e-0gKXZZNgM/VE2Os8RlhJI/AAAAAAAACig/s2nMVs3JQI0/s1600/stagehand-web-template.png" height="287" title="" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Nice Dart web application</td></tr>
</tbody></table>
<br />
Inspecting project files is event better. You will see that you have prepared responsive website with <b>Sass</b>, <b>CSS minification</b> and even <b>routing</b>!<br />
<br />
That is a good start for a new Dart web project, isn't it?<br />
<br />
With Stagehand you can also start your new Polymer project, console app, shelf app or package. One option I am missing is Chrome packaged app, hope it will be added in the future.<br />
<br />
<b>Do you plan to try Stagehand for your next project? For me it is definitely YES.</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-84678148145506646162014-10-09T13:33:00.001+02:002015-02-19T14:59:04.171+01:00Dart + Polymer Hackathon Prague 2014: Přijďte si zahackovat v Dartu!<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-0hG4nhzmnjk/VDZwIkqa9tI/AAAAAAAACC0/hd2gUcZEJxg/s1600/dart-polymer.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-0hG4nhzmnjk/VDZwIkqa9tI/AAAAAAAACC0/hd2gUcZEJxg/s1600/dart-polymer.png" height="100" width="400" /></a></div>
<br />
<br />
Po dvou Dart + Polymer Code Labech organizujeme s GDG Prague 1.11.2014 <b>Dart + Polymer hackathon</b>!<br />
<br />
Můžete pracovat na svých vlastních nápadech, přijít s rozpracovanou aplikací, vyzkoušet si práci s <a href="http://dartlang.org/">Dartem</a> a <a href="https://www.dartlang.org/polymer/">Polymerem</a>, a nebo se můžete přidat a pomoci některému z ostatních týmů.<br />
<br />
Žádné předchozí znalosti Dartu ani Polymeru <b>nejsou nutné</b>. Cílem je si technologie vyzkoušet, něco si v nich třeba napsat a zažít s námi srandu :-)<br />
<br />
Vstup zdarma, registrace nutná, omezená kapacita.<br />
<ul>
<li>Více informací: <a href="http://www.gug.cz/cs/akce/dart--polymer-hackathon-prague/terminy/1">http://www.gug.cz/cs/akce/dart--polymer-hackathon-prague/terminy/1</a></li>
<li>Registrace: <a href="http://goo.gl/ZffzZ1">http://goo.gl/ZffzZ1</a></li>
<li>G+ událost: <a href="https://plus.google.com/events/c71005s5dkiqjams03j7o2dkmgk">https://plus.google.com/events/c71005s5dkiqjams03j7o2dkmgk</a></li>
</ul>
<h4>
<b><br /></b></h4>
<h4>
<b>Jaká byla sranda na posledním Code Labu se můžete přesvědčit z videa:</b></h4>
<div>
<b><br /></b></div>
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/gF20WkeU5lY?rel=0" width="560"></iframe>
<br />
<br />
Případně si o posledním Code Labu můžete přečíst <a href="http://www.jakubskvara.cz/report-z-dart-polymer-code-labu-konaneho-v-zari-2014/">článek</a>.<br />
<br />
<b>Přijdete? :-)</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-49007967103089079952014-09-10T12:00:00.001+02:002015-02-19T14:59:20.774+01:00Dart + Polymer Code Lab: Termín září<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-Uua-0Otu3S4/VBAfBZgV88I/AAAAAAAABzY/NfaBC_9LtPQ/s1600/dart-polymer.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" src="http://4.bp.blogspot.com/-Uua-0Otu3S4/VBAfBZgV88I/AAAAAAAABzY/NfaBC_9LtPQ/s1600/dart-polymer.png" height="100" width="400" /></a></div>
<br />
<br />
S <b><a href="http://www.gug.cz/cs/gdg/skupiny/prague">GDG Prague</a></b> organizujeme 27.9. druhý termín <a href="http://www.gug.cz/cs/akce/dart--polymer-codelab">Dart + Polymer Code Labu</a>. Zajímá tě Dart a Polymer? Tak přijď! Vstup zdarma, registrace nutná, omezená kapacita.<br />
<br />
<ul>
<li>Více informací: <a href="http://www.gug.cz/cs/akce/dart--polymer-codelab/terminy/2-termin-zari">http://www.gug.cz/cs/akce/dart--polymer-codelab/terminy/2-termin-zari</a></li>
<li>Registrace: <a href="https://docs.google.com/forms/d/1gnSx9mHHRDCV1PZKECp04faxwbNBMDIyd9tjCOn0pE8/viewform">https://docs.google.com/forms/d/1gnSx9mHHRDCV1PZKECp04faxwbNBMDIyd9tjCOn0pE8/viewform</a></li>
<li>G+ událost: <a href="https://plus.google.com/b/111919016509847766513/events/ca6bviou86qv5vuvrguvn5p90g8">https://plus.google.com/b/111919016509847766513/events/ca6bviou86qv5vuvrguvn5p90g8</a></li>
</ul>
<div>
<h4>
<b><br /></b></h4>
<h4>
<b>Video z minulého termínu:</b></h4>
</div>
<div>
<b><br /></b></div>
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/UFLNn8q8cBY?rel=0" width="560"></iframe>
<br />
<div>
<br />
<h4>
<b>Minulý termín na G+:</b></h4>
<a href="https://plus.google.com/events/c7nnkm7ql7d2p0kvg24p3ue2nvk">https://plus.google.com/events/c7nnkm7ql7d2p0kvg24p3ue2nvk</a></div>
Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com1Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-40487566398930822002014-09-04T04:05:00.000+02:002015-02-19T14:59:42.613+01:00The 3 main reasons why I love Dart<a href="https://www.dartlang.org/">Dart </a>is a new language from Google which is object oriented with optional types. People are often asking me why I am so interested in Dart. So I have decided to write blog post about the three best highlights in Dart according to me.<br />
<div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-dcPdBhI4Z0o/VAe7gCsGaUI/AAAAAAAABVc/KQTwuWcC4Vw/s1600/dart.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-dcPdBhI4Z0o/VAe7gCsGaUI/AAAAAAAABVc/KQTwuWcC4Vw/s1600/dart.png" height="114" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<h2>
<span style="font-size: large;">
1. Dart is open source and has lots of libraries</span></h2>
<a href="https://api.dartlang.org/">Dart SDK</a> contains lots of libraries which can help you to write amazing apps. Do you want to work with <b>JSON</b>, play with <b>HTML </b>or try <b>Web Sockets</b>? No problem. Everything and more is included, just <a href="https://try.dartlang.org/">try it</a>.<br />
<br />
There is also big community around Dart, people are writing open source libraries to extend possibilities of language and libraries in SDK which can be easily downloaded in your project using <a href="http://pub.dartlang.org/">pub</a>.<br />
<br />
I definitely recommend to follow <a href="https://plus.google.com/communities/114566943291919232850">Dartisans </a>community on Google+. There is lots of interesting posts from the people about language, libraries etc.</div>
<div>
<br />
<h2>
<span style="font-size: large;">2. Dart is really fast</span></h2>
When people are asking me about the reason why they should use Dart I am showing them <a href="https://www.dartlang.org/performance/">this</a>. It is awesome.</div>
<div>
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-Q9zqKWTxqFk/VAe92ei6LyI/AAAAAAAABVo/KCXXkpKVpW0/s1600/dart-performance.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://1.bp.blogspot.com/-Q9zqKWTxqFk/VAe92ei6LyI/AAAAAAAABVo/KCXXkpKVpW0/s1600/dart-performance.png" height="382" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i style="font-size: medium;">Source: <a href="https://www.dartlang.org/performance/">https://www.dartlang.org/performance/</a></i></td></tr>
</tbody></table>
<div style="text-align: center;">
<br /></div>
<div>
<h2>
<span style="font-size: large;">3. Dart is easy to learn</span></h2>
<div>
If you h<span style="font-family: inherit;">ave ever seen Java, Dart is in some way similar BUT better than Java. You can learn it really fast and you will love it. </span>Some small examples:<br />
<br /></div>
</div>
<span id="docs-internal-guid-d006b691-3e43-d8e8-885d-830646754bbc">
</span>
<br />
<h4>
Do you remember constructor in Java? This is Dart</h4>
<pre class="brush: java">class Person {
String firstName;
String lastName;
int age;
Person(this.firstName, this.lastName);
}
void main() {
Person person = new Person("Jana", "Moudrá");
}
</pre>
<br />
<h4>
Private attributes + getter and setter in one line</h4>
<pre class="brush: java">class Person {
String _firstName;
String _lastName;
int _age;
Person(this._firstName, this._lastName);
int get age => _age;
set age(int age) => _age = age;
}
</pre>
<br />
<h4>
Futures!</h4>
<pre class="brush: java">HttpRequest.getString('shapes.json')
.then((String jsonString) {
print(jsonString);
})
.catchError((error) {
print(error);
});
</pre>
<br />
<b>And what do YOU love on Dart?</b>Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981tag:blogger.com,1999:blog-4409514803331315462.post-38732212919525635392014-09-01T15:01:00.000+02:002015-02-19T15:01:30.678+01:00Let´s startHi, I am Jana Moudrá, woman geek from Prague, Czech Republic. I am co-founder of a small company called <a href="http://www.juicymo.cz/">Juicymo</a>, I love my job and everything interesting about IT, especially web.<br />
<br />
I am also organizing some developer related events in our Prague GDGs.<br />
<br />
For some time I am really interested in the new language called Dart, I could say that I am Dart enthusiast, so most of the blog posts will be Dart related, maybe with some posts about Android and design :-)<br />
<br />
If you would like to find me on social networks/contact me, here is my <a href="https://plus.google.com/+JanaMoudr%C3%A1">G+</a>, <a href="http://twitter.com/janamou">Twitter</a>, <a href="http://cz.linkedin.com/in/janamoudra/">LinkedIn </a>and <a href="mailto:jana.moudra@gmail.com">E-mail</a>.
Anonymoushttp://www.blogger.com/profile/14931579478646963401noreply@blogger.com0Prague, Czech Republic50.0755381 14.4378004999999849.749331100000006 13.79235349999998 50.4017451 15.083247499999981