React.js–Get started in Dart #1
Jermaine
Posted on January 1, 2019
Happy New Year folks!
In this three-part series, we will go through the React.js homepage examples and learn how to reproduce these in Dart using the js interop package.
→ Watch on YouTube
→ Get the source code
Before we begin:
1. Set up your project
Set up your web project quickly with Stagehand:
$ mkdir getting_started_react && cd getting_started_react
$ stagehand web-simple
2. Install the js interop package
Ensure that the js dependency is added to your pubspec.yaml file:
dependencies:
js: ^0.6.0
Save and run pub get to update your dependencies.
3. Import the React.js libraries
In web/index.html in the <head> before <script defer src="main.dart.js"></script> import the dev versions of the library:
<!-- Note: when deploying, replace "development.js" with "production.min.js". -->
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
→ Watch the full video
→ Get the source code
Conclusion
I hope this was insightful and you learned something new today.
Subscribe to my YouTube channel to be notified when Part 2 is ready. Thanks!
Like, share and follow me 😍 for more content on Dart.
Further reading
Posted on January 1, 2019
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
