Flutter on CodePen [Integration Alert]

credit: https://codepen.io/flutter

Checkout this video in hindi

There are a lot of news about flutter is flowing around us. One of the most loveable news is this. Flutter integration on CodePen. Yes, it sounds amazing.

Let’s see how and where we can start writing code on CodePen.

Flutter’s Homepage on CodePen is codepen.io/flutter.

Following are available on this homepage:

1. Link for templates to try
2. Link for CodePen editor for coding and viewing results
3. Some information on Material Components, Dart, OpenSource related to Flutter.
4. Link for Profile, Projects, Dashboard, and many more...

Keeping everything apart. We must get some questions in our head

Q. How CodePen.Flutter is different from DartPad?

CodePen is totally professional editor whereas DartPad is for trying out things.

CodePen is having more options like share, assets, comments.

DartPad has documentation of almost every things about flutter.

We can see the compiled fluter code on CodePen.

CodePen has a more interactive way of showing errors.

Change view option is available in CodePen which is helpful while coding and viewing outputs. It serves a different and satisfying experience.

DartPad have code suggestion but CodePen doesn’t.

Q. What are the similarities between CodePen.Flutter and DartPad?

We can see output on the same page.

We have console.

Flutter Code formatter.

Flutter Code templates(readymade code to play around).

What we can expect in future?

Code Suggestions and auto-completion.

More Templates to try

Faster output(I feel it is slow right now)

Let’s try some template that is provided on CodePen

Following is a pen created by Zoey Fan, product manager at google.

This is something I made created for Flutter India.

We (Flutter communities from India) are hosting a global online event ‘Flutter Con India’. Follow https://twitter.com/IndiaFlutter for more updates on it.

If you enjoyed this blog, let me know in the comments below how much useful this blog was to you. I’d be very grateful if you’d help it spread by emailing it to a friend, or sharing it on Twitter or Facebook. Thank you!

Connect with me on: Github Twitter LinkedIn Instagram Youtube Patreon

#HappyCoding #flutter #widgets #crossplatform #tutorial #firebase #viveky259 #procoach

**Subscribe for upcoming posts. Thanks for reading. Let me know what you think about this post.