<p>In this video series we will be looking at the AngularDart framework, building a Bookmark Manager to store our favourite clippings from the web. This single page app will allow us to perform the usual CRUD operations. At the end of this video, we will have the skeleton for our app, displaying a list of bookmarks with delete functionality.</p>
<h2 id="heading-setup"><strong>Setup</strong></h2>
<p>Assuming you have Dart installed, add the <a target="_blank" href="https://pub.dartlang.org/packages/stagehand"><strong>stagehand</strong></a> dependency by running:</p>
<pre><code class="lang-bash">$ pub global activate stagehand
</code></pre>
<p>Create the directory in which you wish to generate the files and folders for your dart project and run the associated commands:</p>
<pre><code class="lang-bash">$ mkdir bookmark_manager &amp;&amp; <span class="hljs-built_in">cd</span> bookmark_manager
$ stagehand web-angular
</code></pre>
<p>Update your dependencies and you are good to go!</p>
<pre><code class="lang-bash">$ pub get
</code></pre>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://youtu.be/9X88k6kTuNw">https://youtu.be/9X88k6kTuNw</a></div>
<p> </p>
<p><a target="_blank" href="https://youtu.be/9X88k6kTuNw">Watch on YouTube</a></p>
<p><a target="_blank" href="https://github.com/graphicbeacon/angulardart-bookmark-manager">Get the source code</a></p>
<h2 id="heading-further-reading"><strong>Further reading</strong></h2>
<ol>
<li><p><a target="_blank" href="https://webdev.dartlang.org/angular/guide"><strong>AngularDart Guide</strong></a></p>
</li>
<li><p><a target="_blank" href="http://localhost:8080/generate-the-scaffolding-for-your-next-project/">Auto-Generate the scaffolding for your next project</a></p>
</li>
<li><p><a target="_blank" href="https://egghead.io/courses/get-started-wtih-dart"><strong>Get started with Dart</strong> <a href="http://Egghead.io" class="autolinkedURL autolinkedURL-url" target="_blank">Egghead.io</a> course</a></p>
</li>
</ol>


In this video series we will be looking at the AngularDart framework, building a Bookmark Manager to store our favourite clippings from the web. This single page app will allow us to perform the usual CRUD operations. At the end of this video, we will have the skeleton for our app, displaying a list of bookmarks with delete functionality.

## **Setup**

Assuming you have Dart installed, add the [**stagehand**](https://pub.dartlang.org/packages/stagehand) dependency by running:

```bash
$ pub global activate stagehand
```

Create the directory in which you wish to generate the files and folders for your dart project and run the associated commands:

```bash
$ mkdir bookmark_manager && cd bookmark_manager
$ stagehand web-angular
```

Update your dependencies and you are good to go!

```bash
$ pub get
```

%[https://youtu.be/9X88k6kTuNw] 

[Watch on YouTube](https://youtu.be/9X88k6kTuNw)

[Get the source code](https://github.com/graphicbeacon/angulardart-bookmark-manager)

## **Further reading**

1. [**AngularDart Guide**](https://webdev.dartlang.org/angular/guide)
    
2. [Auto-Generate the scaffolding for your next project](http://localhost:8080/generate-the-scaffolding-for-your-next-project/)
    
3. [**Get started with Dart** Egghead.io course](https://egghead.io/courses/get-started-wtih-dart)

We will be looking at the AngularDart framework, building a Bookmark Manager to store our favourite clippings from the web with Firebase Realtime database.

AngularDart Tutorial: Let’s Build a Bookmark Manager

AngularDart Tutorial: Let’s Build a Bookmark Manager (Part 1)

Creative Bracket is the go-to Dart resource blog on the Dart language and tools with easy to understand Dart tutorials and videos for your next project.
