IT VO VAN TIEN

10 Packages Sublime Text cần thiết cho Frontend Developers

<h2 class="excerpt" style="background-color: white; box-sizing: border-box; color: #141414; font-family: Roboto, sans-serif; font-size: 18px; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
Sublime Text là một trong những IDE đang được rất nhiều lập trình viên yêu thích vì tính năng hấp dẫn và rất nhẹ.</h2>
<div class="ads" id="google-ads-1" style="background-color: white; box-sizing: border-box; color: #141414; font-family: Roboto, sans-serif; font-size: 14px; margin: auto; text-align: center;">
</div>
<div class="relate-news" style="background-color: white; box-sizing: border-box; color: #141414; font-family: Roboto, sans-serif; font-size: 14px;">
<ul style="box-sizing: border-box; margin-bottom: 10px; margin-top: 0px;"></ul>
</div>
<div class="ads" style="background-color: white; box-sizing: border-box; color: #141414; font-family: Roboto, sans-serif; font-size: 14px; margin: auto; text-align: center;">
</div>
<div class="entry-content" style="background-color: white; box-sizing: border-box; color: #141414; font-family: Roboto, sans-serif; font-size: 14px;">
<div style="box-sizing: border-box; margin-bottom: 10px;">
<span style="box-sizing: border-box; font-weight: 700;">Sublime Text</span> là một IDE nhẹ và nhiều tính năng hay. Bạn có thể thêm những tính năng mới thông qua việc cài đặt <span style="box-sizing: border-box; font-weight: 700;">Plugin</span> hay <span style="box-sizing: border-box; font-weight: 700;">Package. </span>Những plugin được thêm vào sẽ mở rộng thêm tính năng cho Sublime Text.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="10-packages-sublime-text-can-thiet-cho-frontend-developers" class="lazy aligncenter size-full wp-image-1492" data-lazy-src="http://nqdung.info/wp-content/uploads/10-packages-sublime-text-can-thiet-cho-frontend-developers.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/10-packages-sublime-text-can-thiet-cho-frontend-developers.jpg 800w, http://nqdung.info/wp-content/uploads/10-packages-sublime-text-can-thiet-cho-frontend-developers-267x200.jpg 267w" data-lazy-type="image" height="600" sizes="(max-width: 800px) 100vw, 800px" src="http://nqdung.info/wp-content/uploads/10-packages-sublime-text-can-thiet-cho-frontend-developers.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="800" /></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Có thể một số package sẽ không tương thích với bản Sublime Text 3. Những tính năng trong bài viết này sẽ giúp cho những frontend developer thao tác nhanh chóng hơn.</div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
1. AlignTab</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/randy3k/AlignTab" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">AlignTab</a> là một package giúp bạn sắp xếp lại code một cách gọn gàng hơn. AlignTab có hổ trợ “Preview Mode” giúp bạn có thể xem trước khi nó thực hiện sắp xếp.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="align-tab" class="lazy aligncenter size-full wp-image-1493" data-lazy-src="http://nqdung.info/wp-content/uploads/align-tab.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/align-tab.jpg 700w, http://nqdung.info/wp-content/uploads/align-tab-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/align-tab.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
2. ColorHighlighter</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/Monnoroch/ColorHighlighter/" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">ColorHighlighter</a> là package cho phép bạn nhìn thấy màu sắc của mã màu mà mình sử dụng trong CSS, LESS, SASS,… Bạn cũng có thể thay đổi màu bằng cách nhấn đề chuột vào mã màu cần đổi.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="Description" class="lazy  aligncenter" data-canonical-src="http://i.imgur.com/UPmEk09.png" data-lazy-src="https://camo.githubusercontent.com/e13f5346a650e7e3fc2269fd4de3904d78c8fd1e/687474703a2f2f692e696d6775722e636f6d2f55506d456b30392e706e67" data-lazy-type="image" src="https://camo.githubusercontent.com/e13f5346a650e7e3fc2269fd4de3904d78c8fd1e/687474703a2f2f692e696d6775722e636f6d2f55506d456b30392e706e67" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" /></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="Description" class="lazy  aligncenter" data-canonical-src="http://sametmax.com/wp-content/uploads/2013/04/hilight-color.gif" data-lazy-src="https://camo.githubusercontent.com/88316b57b3173bdea1c93b0ac5634103bbf649a9/687474703a2f2f73616d65746d61782e636f6d2f77702d636f6e74656e742f75706c6f6164732f323031332f30342f68696c696768742d636f6c6f722e676966" data-lazy-type="image" src="https://camo.githubusercontent.com/88316b57b3173bdea1c93b0ac5634103bbf649a9/687474703a2f2f73616d65746d61782e636f6d2f77702d636f6e74656e742f75706c6f6164732f323031332f30342f68696c696768742d636f6c6f722e676966" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" /></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="Description" class="lazy  aligncenter" data-canonical-src="http://sametmax.com/wp-content/uploads/2013/04/color-picker.gif" data-lazy-src="https://camo.githubusercontent.com/6d582efa7356d7832269c9e164cc1bef8788952e/687474703a2f2f73616d65746d61782e636f6d2f77702d636f6e74656e742f75706c6f6164732f323031332f30342f636f6c6f722d7069636b65722e676966" data-lazy-type="image" src="https://camo.githubusercontent.com/6d582efa7356d7832269c9e164cc1bef8788952e/687474703a2f2f73616d65746d61782e636f6d2f77702d636f6e74656e742f75706c6f6164732f323031332f30342f636f6c6f722d7069636b65722e676966" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
3. MultiEditUtils</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/philippotto/Sublime-MultiEditUtils" rel="external nofollow" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">MultiEditUtils </a>là package giúp cải thiện tính năng “đa con trỏ” của Sublime Text</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="multi-edit-utils" class="lazy aligncenter size-full wp-image-1494" data-lazy-src="http://nqdung.info/wp-content/uploads/multi-edit-utils.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/multi-edit-utils.jpg 700w, http://nqdung.info/wp-content/uploads/multi-edit-utils-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/multi-edit-utils.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
4. Git Gutter</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Nếu bạn đang làm việc với Git, mình khuyên bạn nên cài<a href="https://github.com/jisaacks/GitGutter/" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank"> <span class="goog-text-highlight" style="box-sizing: border-box;">Git Gutter</span></a>. Package này giúp cảnh bảo những thay đổi phiên bản của bạn với Git server</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="git-gutter" class="lazy aligncenter size-full wp-image-1495" data-lazy-src="http://nqdung.info/wp-content/uploads/git-gutter.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/git-gutter.jpg 700w, http://nqdung.info/wp-content/uploads/git-gutter-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/git-gutter.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
5. Modific</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Cũng giống như GitGutter, <a href="https://github.com/gornostal/Modific" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">Modific</a> rất hữu ích khi bạn đang sử dụng Git hoặc SVN trong công việc của bạn.Ngoài việc làm nổi bật, bạn có thể xem sự khác nhau giữa các phiên bản và commit bằng cách sử dụng tổ hợp phím <span style="box-sizing: border-box; font-weight: 700;">Ctrl + Alt + D</span></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="modific" class="lazy aligncenter size-full wp-image-1496" data-lazy-src="http://nqdung.info/wp-content/uploads/modific.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/modific.jpg 700w, http://nqdung.info/wp-content/uploads/modific-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/modific.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h2 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 30px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
6. Inc Dec Value</h2>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/rmaksim/Sublime-Text-2-Inc-Dec-Value" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;">Inc Dec Value</a> cho phép bạn tăng giá trị của số đồng thời, dù nằm trên những dòng khác nhau. Đối với String thì sẽ chuyển từ viết hoa sang thường và ngược lại</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="inc-dec-value" class="lazy aligncenter size-full wp-image-1497" data-lazy-src="http://nqdung.info/wp-content/uploads/inc-dec-value.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/inc-dec-value.jpg 700w, http://nqdung.info/wp-content/uploads/inc-dec-value-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/inc-dec-value.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
7. FileBrowser</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/aziz/SublimeFileBrowser" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">FileBrowser</a> cung cấp khả năng duyệt file linh hoạt hơn so với mặc định. Bạn có thể duyệt thư mục mà không cần đưa con trỏ chuột sang sidebar.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="file-browser" class="lazy aligncenter size-full wp-image-1498" data-lazy-src="http://nqdung.info/wp-content/uploads/file-browser.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/file-browser.jpg 700w, http://nqdung.info/wp-content/uploads/file-browser-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/file-browser.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
8. IconFont</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/idleberg/Icon-Fonts-Sublime-Text" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">IconFont</a> cung cấp đoạn cho nhiều phông chữ biểu tượng phổ biến như <a href="http://fortawesome.github.io/Font-Awesome/" rel="external nofollow" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">FontAwesome</a> ,<a href="http://paymentfont.io/" rel="external nofollow" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">PaymentFont</a> , <a href="http://typicons.com/" rel="external nofollow" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">Typicons</a> và <a href="https://octicons.github.com/" rel="external nofollow" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">Github Octicons</a>.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="icon-fonts" class="lazy aligncenter size-full wp-image-1499" data-lazy-src="http://nqdung.info/wp-content/uploads/icon-fonts.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/icon-fonts.jpg 700w, http://nqdung.info/wp-content/uploads/icon-fonts-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/icon-fonts.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
9. DistractionFreeWindow</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Tính năng Free Distraction của Sublime Text giúp bạn có thể tập trung code mà không bị phân tâm bởi <span style="box-sizing: border-box; font-weight: 700;">minimap, sidebar, và tất cả các tab đang ẩn.<a href="https://github.com/aziz/DistractionFreeWindow" style="background-color: transparent; box-sizing: border-box; color: #242424; font-weight: 500; text-decoration-line: none;" target="_blank">DistractionFreeWindow</a> </span><span class="goog-text-highlight" style="box-sizing: border-box;">giúp bạn định nghĩa các điều kiện để </span><span class="goog-text-highlight" style="box-sizing: border-box;">Distraction Free Mode hoạt động linh hoạt hơn.</span></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="distraction-free" class="lazy aligncenter size-full wp-image-1500" data-lazy-src="http://nqdung.info/wp-content/uploads/distraction-free.jpg?70564f" data-lazy-srcset="http://nqdung.info/wp-content/uploads/distraction-free.jpg 700w, http://nqdung.info/wp-content/uploads/distraction-free-310x168.jpg 310w" data-lazy-type="image" height="380" sizes="(max-width: 700px) 100vw, 700px" src="http://nqdung.info/wp-content/uploads/distraction-free.jpg?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="700" /></div>
<h3 style="box-sizing: border-box; color: inherit; font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1.1; margin-bottom: 10px; margin-top: 20px;">
10. FilterLines</h3>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<a href="https://github.com/davidpeckham/sublime-filterlines" style="background-color: transparent; box-sizing: border-box; color: #242424; text-decoration-line: none;" target="_blank">FilterLines</a> cho phép bạn tìm kiếm chuổi từ khóa hoặc chuổi RegEx. Tính năng này rất hữu ích với những ai phải duyệt <span style="box-sizing: border-box; font-weight: 700;">dữ liệu thô</span> ở dạng JSON, JavaScript Array, CVS</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<img alt="filter-lines" class="lazy aligncenter size-full wp-image-1501" data-lazy-src="http://nqdung.info/wp-content/uploads/filter-lines.gif?70564f" data-lazy-type="image" height="474" src="http://nqdung.info/wp-content/uploads/filter-lines.gif?70564f" style="border: 0px; box-sizing: border-box; clear: both; display: block; height: auto; margin-left: auto; margin-right: auto; max-width: 100%; vertical-align: middle;" width="800" /></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Trên đây là một số package cần thiết cho frontend developer nếu bạn biết thêm thì hãy để lại comment để mình bổ sung vào vài viết này.</div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
<br /></div>
<div style="box-sizing: border-box; margin-bottom: 10px;">
Nguồn: Copy </div>
</div>

10 Packages Sublime Text cần thiết cho Frontend Developers

Sublime Text là một trong những IDE đang được rất nhiều lập trình viên yêu thích vì tính năng hấp dẫn và rất nhẹ. Sublime Text l...

Những Plugin sublime text cần thiết cho Web Developers

<h3 id="package-control-0" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="color: blue; font-family: "times" , "times new roman" , serif;">Sublime Text</span></h3>
<span style="background-color: white; font-size: 16px;"><span style="font-family: "times" , "times new roman" , serif;"><b><span style="color: blue;">Sublime text</span></b><span style="color: #0b1a33;"> là một trong những trình biên tập code có sẵn phổ biến nhất hiện nay . Nó được yêu mến bởi nhiều lập trình viên do tốc độ, đơn giản, và môi trường phong phú Plugin.</span></span></span><br />
<ul>
<li><span style="font-family: "times" , "times new roman" , serif;">Sublime text là một editor khá mạnh vì có nhiều plugin hữu ích, có thể cài đặt 1 cách dễ dàng trực tiếp. Cung cấp một hiệu suất làm việc với các tính năng rất tuyệt vời giúp cho các web Developers viết code dễ dàng hơn và tăng năng suất hoạt động</span></li>
<li><span style="font-family: "times" , "times new roman" , serif;">Để giúp các bạn nhận được nhiều nhất trợ giúp của Sublime, tôi quyết định làm một danh sách các plugins mà tôi sử dụng và yêu thích. Nếu tôi chưa bao gồm những plugin yêu thích của bạn, hãy chia sẻ với tôi trong phần bình luận !</span></li>
<li><span style="font-family: "times" , "times new roman" , serif;">Những tính năng trong bài viết này sẽ giúp cho những web developer thao tác nhanh chóng hơn.</span></li>
</ul>
<h3 id="package-control-0" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="color: blue; font-family: "times" , "times new roman" , serif;">Package Control</span></span></h3>
<ul style="background-color: white; box-sizing: inherit; color: #0b1a33; font-size: 14px; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Sublime Text là một IDE nhẹ và nhiều tính năng hay. Bạn có thể thêm những tính năng mới thông qua việc cài đặt Plugin hay Package. Những plugin được thêm vào sẽ mở rộng thêm tính năng cho Sublime Text.</span></div>
</li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Nếu các bạn chưa cài đặt package control, thì trước tiên chúng ta cần cài đặt package control</span></div>
</li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Đây là một plugin quản lý của sublime giúp chúng ta dễ dàng quản lý các package (sửa, xóa,...)</span></div>
</li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Hướng dẫn cài đặt package control và sử dụng :</span></div>
<ul style="box-sizing: inherit; margin-bottom: 0px; margin-top: 0px;">
<li style="box-sizing: inherit; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Bạn ấn tổ hợp phím Ctrl + để mở chế độ command, rồi thực hiện như sau :</span></li>
<li style="box-sizing: inherit; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Bạn đến link này <a href="https://packagecontrol.io/installation" style="background-color: transparent; box-sizing: inherit; color: #5488c7; text-decoration-line: none; touch-action: manipulation;" target="_blank">https://packagecontrol.io/installation</a> và copy đoạn cài đặt tùy vào bản sublime text bạn sử dụng như hình ảnh này</span></li>
</ul>
<div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<img alt="Installation   Package Control.png" data-lity="true" src="https://viblo.asia/uploads/0f6c41e8-0f23-4881-a085-ce38c117cb36.png" style="border-style: none; box-sizing: inherit; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
<ul style="box-sizing: inherit; margin-bottom: 0px; margin-top: 0px;">
<li style="box-sizing: inherit; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Sau khi copy xong bạn quay lại sublime text và paste đoạn copy vào command và ấn enter</span></li>
<li style="box-sizing: inherit; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Khởi động lại sublime text</span></li>
</ul>
</li>
</ul>
<div style="background-color: white; box-sizing: inherit; color: #0b1a33; font-size: 16px; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<img alt="1-package-control.png" data-lity="true" src="https://viblo.asia/uploads/c50e172a-3bc4-44b5-8645-67b4b121012e.png" style="border-style: none; box-sizing: inherit; cursor: pointer; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
<h3 id="javascript-nodejs-snippets-1" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="color: blue; font-family: "times" , "times new roman" , serif;">Plugins</span></span></h3>
<h3 id="javascript-nodejs-snippets-1" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<br />
<ul>
<li><span style="font-family: "times" , "times new roman" , serif; font-size: small;">Để cài đặt các plugin bạn sử dụng phím tắt Ctrl + Shift + p chọn mục Package control: install package, tiếp đó nhập tên package mà bạn muốn cài đặt</span></li>
<li><span style="font-family: "times" , "times new roman" , serif; font-size: small;">Các plugin hay cho sublime text 3:</span></li>
</ul>
</h3>
<h3 id="javascript-nodejs-snippets-1" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: "times" , "times new roman" , serif;">1. JavaScript & NodeJS Snippets</span></span></h3>
<h3 id="javascript-nodejs-snippets-1" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<ul style="box-sizing: inherit; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Các đoạn viết tắt biểu thức JavaScript phổ biến nhanh hơn nhiều. Tại sao viết document.querySelector('selector'); khi bạn có thể chỉ cần gõ qs, nhấn tab, và để cho Sublime làm phần còn lại.</span></li>
</ul>
<div style="box-sizing: inherit; font-size: 16px; font-weight: normal; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<img alt="2-js-snippets.gif" data-lity="true" src="https://viblo.asia/uploads/abe8464d-e305-4531-b364-25f59737e6cd.gif" style="border-style: none; box-sizing: inherit; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
<ul style="box-sizing: inherit; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">link hướng dẫn cài đặt và sử dụng :<a href="https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets" style="background-color: transparent; box-sizing: inherit; color: #5488c7; text-decoration-line: none; touch-action: manipulation;" target="_blank">https://packagecontrol.io/packages/JavaScript%20%26%20NodeJS%20Snippets</a></span></li>
</ul>
</h3>
<h3 id="emmet-2" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: "times" , "times new roman" , serif;">2. Emmet</span></span></h3>
<h3 style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: inherit; font-size: 16px; font-weight: normal; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="color: #444444; font-family: "Open Sans"; font-size: 14px; letter-spacing: normal;">Đây là package cho phép chúng ta gõ tắt code HTML&CSS cách dùng là dùng các cú pháp gõ tắt mà emmet hỗ trợ sau đó ấn </span><code style="background: rgb(240, 240, 240); border-radius: 2px; border: 0px; box-sizing: border-box; font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-stretch: normal; letter-spacing: normal; line-height: normal; margin: 0px; outline: 0px; padding: 1px; vertical-align: baseline;"><span style="color: red;">tab</span></code><span style="color: #444444; font-family: "Open Sans"; font-size: 14px; letter-spacing: normal;"> để thực hiên.</span><br />
<div style="color: #0b1a33;">
<span style="color: #444444; font-family: "Open Sans"; font-size: 14px; letter-spacing: normal;"><br /></span></div>
<div style="color: #0b1a33;">
<img alt="3-emmet.gif" data-lity="true" src="https://viblo.asia/uploads/6ddb93b4-7de3-4262-9e3c-199cce30258e.gif" style="border-style: none; box-sizing: inherit; cursor: pointer; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
</div>
<ul style="box-sizing: inherit; color: #0b1a33; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Giống như các plugin trước đó giúp bạn viết code nhanh hơn. Sự khác biệt ở đây là thay vì expresions JS, Emmet là cho HTML và CSS, cho phép bạn viết thẻ dài, các yếu tố lồng nhau ...</span></div>
</li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Emmet có một chút phức tạp, vì vậy nếu muốn có một sự thay thế đơn giản, bạn có thể thử một plugin tương tự gọi là HTML Snippets. Nó có tính năng ít hơn, nhưng là cách dễ dàng hơn để sử dụng, và có tài liệu hướng dẫn sử dụng đơn giản, tuyệt vời.</span></div>
</li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><div style="box-sizing: inherit; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<span style="font-family: "times" , "times new roman" , serif;">Link hướng dẫn cài đặt và cách sử dụng <a href="https://packagecontrol.io/packages/Emmet" style="background-color: transparent; box-sizing: inherit; color: #5488c7; text-decoration-line: none; touch-action: manipulation;" target="_blank">https://packagecontrol.io/packages/Emmet</a></span></div>
</li>
</ul>
</h3>
<h3 id="advanced-new-file-3" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: "times" , "times new roman" , serif;">3. Advanced New File</span></span></h3>
<h3 style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<ul style="box-sizing: inherit; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Gói tuyệt vời này có thể tạo ra các tập tin mới với tốc độ nhanh. Thay vì duyệt qua các thư mục, và sử dụng các menu, bạn chỉ cần mở một dấu nhắc với ctrl + alt + n và viết đường dẫn đến tập tin mới của bạn.</span></li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Các plugin cũng sẽ bổ sung thêm bất kỳ thư mục không tồn tại từ đường dẫn, và thậm chí còn hỗ trợ tự động hoàn tất các tên thư mục.</span></li>
</ul>
<div style="box-sizing: inherit; font-size: 16px; font-weight: normal; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<img alt="5-new-file.gif" data-lity="true" src="https://viblo.asia/uploads/97cfd378-5c54-405b-8001-f88d419d7ec5.gif" style="border-style: none; box-sizing: inherit; cursor: pointer; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
<ul style="box-sizing: inherit; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Link hướng dẫn cài đặt và cách sử dụng :<br style="box-sizing: inherit;" /><a href="https://packagecontrol.io/packages/AdvancedNewFile" style="background-color: transparent; box-sizing: inherit; color: #5488c7; text-decoration-line: none; touch-action: manipulation;" target="_blank">https://packagecontrol.io/packages/AdvancedNewFile</a></span></li>
</ul>
</h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: "times" , "times new roman" , serif;">4. Git</span></span></h3>
<h3 style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: inherit; font-size: 16px; font-weight: normal; letter-spacing: -0.003em; line-height: 1.65; margin-bottom: 0.5em; word-break: break-word; word-wrap: break-word;">
<img alt="4-git-.png" data-lity="true" src="https://viblo.asia/uploads/adbddcf9-d87d-4e69-bf74-a7cbeed5af4f.png" style="border-style: none; box-sizing: inherit; cursor: pointer; display: block; margin: 1rem auto; max-width: 100%; text-align: center; vertical-align: middle;" /></div>
<ul style="box-sizing: inherit; font-size: 14px; font-weight: normal; margin-bottom: 1rem; margin-top: 0px;">
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Một tích hợp Git hoạt động trực tiếp từ bảng lệnh Sublime Text. Phần mềm cung cấp truy cập nhanh đến các lệnh Git, giúp bạn thêm tập tin, commit, hoặc mở Git log, mà không bao giờ rời khỏi Sublime.</span></li>
<li style="box-sizing: inherit; font-size: 16px; word-wrap: break-word;"><span style="font-family: "times" , "times new roman" , serif;">Link hướng dẫn cài đặt và sử dụng : <a href="https://packagecontrol.io/packages/Git" style="background-color: transparent; box-sizing: inherit; color: #33629c; outline-width: 0px; touch-action: manipulation;" target="_blank">https://packagecontrol.io/packages/Git</a></span></li>
</ul>
</h3>
<h3 style="box-sizing: border-box; font-size: 24px; font-stretch: normal; line-height: 26px; margin-bottom: 5px; margin-top: 20px;">
<span style="color: blue;"></span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: Times, Times New Roman, serif;">5. </span></span>DocBlock</h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="background-color: #d2d2d8; box-sizing: border-box; color: #111111; font-size: 14px; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
</div>
<div class="wp-caption aligncenter" id="attachment_3350" style="background-color: #d2d2d8; box-sizing: border-box; color: #111111; font-size: 14px; font-weight: normal; margin: 0px auto; text-align: center; width: 486px;">
<span style="font-family: "times" , "times new roman" , serif;"><img alt="DocBlockr" class="size-full wp-image-3350" height="448" src="http://hocphp.info/wp-content/uploads/2017/03/1440679200docblockr.gif" style="border: 0px; box-sizing: border-box; vertical-align: middle;" width="476" /></span></div>
<span style="font-family: "times" , "times new roman" , serif;"><br style="background-color: #d2d2d8; box-sizing: border-box; color: #111111; font-size: 14px; font-weight: normal;" /><span style="background-color: white;"><span style="font-size: small;"><span style="color: #111111; font-weight: normal;">Thỉnh thoảng việc thêm các bình luận dành cho lập trình của bạn có thể là một nỗi đau thực sự. Chúng tôi không biết nhiều người có thích việc này hay không, nhưng điều đó thật sự là hoàn toàn cần thiết. DocBlockr giúp bạn cảm thấy thoải mái khi làm điều này. Sau khi cài đặt DocBlockr, thì tất cả những gì bạn cần làm là bắt đầu một dòng với/* hay /** và DocBlockr sẽ giúp bạn thực hiện phần còn lại. Nếu bạn bắt đầu với /** trên một chức năng, thì nó sẽ sinh ra các bình luận cho bạn dựa trên định dạng JSDoc. DocBlockr sẽ là một plugin tuyệt vời mà bạn không ngờ tới.</span><br style="box-sizing: border-box; color: #111111; font-weight: normal;" /><span style="color: #111111; font-weight: normal;">DocBlockr cũng hỗ trợ nhiều ngôn ngữ khác như: CoffeeScript, TypeScript, PHP, ActionScript, Haxe, Java, Apex, Groovy, Objective C, C, C++, và Rust.</span></span></span></span></h3>
<div>
<span style="font-family: "times" , "times new roman" , serif;"><h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-family: "Times New Roman"; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: Times, Times New Roman, serif;">6. SlideBar Enhancements</span></span></h3>
<div>
<span style="box-sizing: inherit; font-weight: bolder;"><span style="background-color: white; color: #444444; font-family: "Open Sans"; font-size: 14px; font-weight: normal;">Package này tạo ra các context menu với nhiều tiện ích tốt như open in browser...</span></span></div>
</span></div>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;"><img alt="sidebar toidicode,com" src="https://toidicode.com/upload/images/thangcoder/sidebar.png" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; height: 720px; margin: 10px; max-width: 100%; text-align: center; vertical-align: middle; width: 425px;" /></span><br />
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;">Sublime Text có rất ít lựa chọn để thao tác các tệp tin trong cây sidebar của bạn. Hãy nói đơn giản là SideBarEnhancements sẽ giúp bạn thực hiện điều này. Đặc biệt plugin này cung cấp lựa chọn “move to trash” (di chuyển tới thùng rác) dành cho các tệp tin và các thư mục, lựa chọn “open with…” (mở cùng với…) và thậm chí là một clipboard. Plugin này còn cho phép bạn mở các tệp tin ở trình duyệt web của bạn, sao chép nội dung của một tệp tin như data:uri base64 (mà đặc biệt là dễ dàng nhúng các hình ảnh trong CSS) và cung cấp một host dành cho các hoạt động tìm kiếm. Ngoài ra plugin này còn tích hợp với SideBarGit để mang đến các câu lệnh Git trực tiếp từ sidebar.</span></div>
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;">Với sự phát triển của JavaScript, một phương tiện hợp lý để điều hướng dự án của bạn và có thể thao tác các tệp tin của dự án là điều cần thiết. Do đó bạn phải có plugin này trong hộp công cụ của mình.</span><br />
<span style="background-color: white; color: #0b1a33; font-family: Times, "Times New Roman", serif; font-size: 1.45rem; font-weight: bolder;"><br /></span>
<span style="background-color: white; color: #0b1a33; font-family: Times, "Times New Roman", serif; font-size: 1.45rem; font-weight: bolder;">7. Bootstrap 3, 4</span></div>
</h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<br />
<ul>
<li><span style="font-size: small;">Plugin này giúp chúng ta viết nhanh các mã html theo chuẩn bootstrap 3, 4  một cách nhanh chóng.</span></li>
<li><span style="font-size: small;">Xem thêm về plugin này tại đây https://packagecontrol.io/packages/Bootstrap%203%20Snippets</span></li>
</ul>
</div>
</h3>
<h3 style="background-color: #d2d2d8; box-sizing: border-box; color: #0099cc; font-size: 24px; font-stretch: normal; font-weight: 400; line-height: 26px; margin-bottom: 5px; margin-top: 20px;">
<span style="font-family: "times" , "times new roman" , serif;"></span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: Times, Times New Roman, serif;">8. AngularJS</span></span></h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;">Angular JS được phát triển bởi nhóm Angular-UI, đây có lẽ là một trong những gói lớn nhất được liệt kê trong danh sách này. Plugin này có các tính năng nổi bật như:<br style="box-sizing: border-box;" />. Code completion của AngularJS Directives cốt lõi (Directives là một thành phần mở rộng HTML, hay nói cách khác là các thuộc tính (properties) của các thẻ HTML mà Angular nó định nghĩa thêm) (như ng-model, ng-repeat…)<br style="box-sizing: border-box;" />. Directive completions dành cho directive được xác định<br style="box-sizing: border-box;" />. Quick Panel – tìm kiếm các directive, bộ điều khiển và bộ lọc<br style="box-sizing: border-box;" />. Các snippet liên quan đến Angular<br style="box-sizing: border-box;" />. GoToDocs dành cho AngularJS directives cốt lõi<br style="box-sizing: border-box;" />Do Angular là một thư viện lớn như thế, nên chúng tôi nhận thấy rằng đây là một plugin hữu ích đến kinh ngạc. Nó có nhiều cài đặt mà bạn có thể tìm hiểu thêm qua trang web của nó.<br style="box-sizing: border-box;" />Để tận dụng cú pháp của plugin này, thay đổi kiểu xem cho tệp tin HTML, thì bạn hãy làm theo chỉ dẫn sau đây:<br style="box-sizing: border-box;" />View -> Syntax -> HTML (Angular.js)<br style="box-sizing: border-box;" />– Các bạn có thể xem thêm tại đây https://packagecontrol.io/packages/AngularJS</span></div>
</h3>
<h3 style="background-color: #d2d2d8; box-sizing: border-box; color: #0099cc; font-size: 24px; font-stretch: normal; font-weight: 400; line-height: 26px; margin-bottom: 5px; margin-top: 20px;">
<span style="font-family: "times" , "times new roman" , serif;"></span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: Times, Times New Roman, serif;">9. TypeScript</span></span></h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;">TypeScript là một tập cha được đánh máy của JavaScript, nó biên dịch sang JavaScript thuần túy. Điều này có lẽ chẳng có gì đáng ghê gớm đối với các lập trình viên, ngoại trừ một tuyên bố nhỏ hồi tháng Ba năm nay khi nói rằng: Angular 2 sẽ được xây dựng dựa trên Typescript. Điều này có nghĩa là nếu bạn đang làm việc với Angular và bạn đang có ý định chuyển sang Angular 2 trong tương lai, thì TypeScript là một plugin mà bạn cần phải có.<br style="box-sizing: border-box;" />Ngoài việc được sự ủng hộ của Microsoft, thêm code completion, cú pháp chính xác, định dạng code và các khả năng điều hướng được mở rộng sang các dự án TypeScript của bạn. Nó còn đề cập đến hệ thống xây dựng cho phép bạn biên dịch các tệp tin TypeScript sang JavaScript.<br style="box-sizing: border-box;" />Để truy cập vào hệ thống xây dựng thì bạn làm theo chỉ dẫn sau: Tools -> Build System và chọn TypeScript. Sau đó mở một tệp tin kết thúc với đuôi .ts và chọn Tools -> Build hoặc đơn giản là nhấn tổ hợp phím Ctrl + B. Bạn sẽ được yêu cầu về bất kỳ tham số xây dựng nào. Và nó chỉ cần Node.<br style="box-sizing: border-box;" />– Các bạn có thể xem thêm tại đây https://packagecontrol.io/packages/TypeScript</span><br />
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;"><br /></span></div>
</h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">10. Bracket HighLighter</span></h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; color: #111111; font-weight: normal; line-height: 22px; margin-bottom: 10px;">
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 20px; margin-top: 20px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
</div>
<span style="background-color: white; font-family: "times" , "times new roman" , serif; font-size: small;"></span><br />
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
Đây là package giúp cho các bạn có thể dễ nhìn ra phần mở/ đóng của thẻ nằm ở chỗ nào.</div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
<br /></div>
</div>
</h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">11. Color HighLighter</span></h3>
<div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
Package này giúp bạn code css hay hơn bằng cách hiển thị luôn màu sắc của mã màu.</div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<img alt="color hightlighter" src="https://toidicode.com/upload/images/thangcoder/color-hightlighter.gif" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; height: 400px; margin: 10px; max-width: 100%; vertical-align: middle; width: 700px;" /></div>
</div>
<div>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">12. Color Picker</span></h3>
<div style="background-color: white; border: 0px; box-sizing: border-box; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
<span style="color: #444444;">Package này giúp cho chúng ta có thể lấy được mã màu mà không cần dùng đến photoshop, Để mở hộp thoại chúng ta nhấn tổ hợp phím </span><code style="background: rgb(240, 240, 240); border-radius: 2px; border: 0px; box-sizing: border-box; font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-stretch: normal; line-height: normal; margin: 0px; outline: 0px; padding: 1px; vertical-align: baseline;"><span style="color: red;">Ctrl + shift + C</span></code><span style="color: #444444;"> (package này kết hợp với package </span><strong style="border: 0px; box-sizing: border-box; color: #444444; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">color heighlighter</strong><span style="color: #444444;"> thì tuyệt vời).</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<img alt="color picker toidicode.com" src="https://toidicode.com/upload/images/thangcoder/color-picker.png" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; height: 455px; margin: 10px; max-width: 100%; vertical-align: middle; width: 800px;" /></div>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">13. </span>AutoPrefixer.</h3>
<div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
Package này rất cần thiết cho các bạn làm front-end, Nó giúp tạo ra các prefix cho các trình duyệt tương ứng.</div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<img alt="autoprefix toidicode" src="https://toidicode.com/upload/images/thangcoder/autoprefix.gif" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; height: 227px; margin: 10px; max-width: 100%; vertical-align: middle; width: 600px;" /></div>
</div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<br /></div>
</div>
<h4 style="background-color: #d2d2d8; box-sizing: border-box; color: #0099cc; font-size: 20px; font-stretch: normal; font-weight: 400; line-height: 23px; margin-bottom: 5px; margin-top: 10px;">
<span style="font-family: "times" , "times new roman" , serif;"></span></h4>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">14. HTML-CSS-JS Prettify</span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><div style="border: 0px; box-sizing: border-box; font-family: "Open Sans"; font-size: 14px; font-weight: normal; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
<span style="color: #444444;">-Đôi khi code của chúng ta sẽ rất lộn xộn và khó có thể đọc được, và package này giúp cho code của chúng ta được fomat lại theo đúng chuẩn. Hỗ trợ HTML, CSS, Javascript và JSON, để fomat gõ tổ hợp phím </span><span style="color: red;"><code style="background: rgb(240, 240, 240); border-radius: 2px; border: 0px; box-sizing: border-box; font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-stretch: normal; line-height: normal; margin: 0px; outline: 0px; padding: 1px; vertical-align: baseline;">Ctrl + shift+ h</code>.</span></div>
<div style="border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; font-weight: normal; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<img alt="HTML- CSS-JS toidicode" src="https://toidicode.com/upload/images/thangcoder/htmlcssjs.gif" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; height: 500px; margin: 10px; max-width: 100%; vertical-align: middle; width: 500px;" /></div>
</span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="font-family: Times, Times New Roman, serif;">15. CodeIntel</span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; color: #0b1a33; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="box-sizing: inherit; font-weight: bolder;"><div style="border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; font-weight: normal; margin-bottom: 7px; outline: 0px; padding: 0px; vertical-align: baseline; word-wrap: break-word;">
-package này giúp các bạn có thể dễ dàng tìm ra các function,class,.. đang sử dụng được viết từ đâu...</div>
<div style="border: 0px; box-sizing: border-box; color: #444444; font-family: "Open Sans"; font-size: 14px; font-weight: normal; margin-bottom: 7px; outline: 0px; padding: 0px; text-align: center; vertical-align: baseline; word-wrap: break-word;">
<img alt="code intel toidicode.com" src="https://toidicode.com/upload/images/thangcoder/codeintel.gif" style="border: 0px; box-shadow: rgba(0, 0, 0, 0.67) 0px 10px 37px -7px; box-sizing: border-box; height: 323px; margin: 10px; max-width: 100%; vertical-align: middle; width: 685px;" /></div>
<div>
<br /></div>
<div>
16. Đang cập nhật thêm...</div>
</span></h3>
<h3 id="git-4" style="background-color: white; border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; font-size: 1.45rem; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<span style="color: blue;"><span style="box-sizing: inherit; font-weight: bolder;"><span style="font-family: Times, Times New Roman, serif;">T</span></span>ổng kết</span></h3>
<h3 style="border-bottom: 1px solid rgb(219, 227, 232); box-sizing: inherit; line-height: 1.1; margin: 1.7rem 0px 0.6rem; padding-bottom: 0.5rem;">
<div style="box-sizing: border-box; line-height: 22px; margin-bottom: 10px;">
<span style="font-family: "times" , "times new roman" , serif;"><span style="background-color: white;"><span style="font-size: small;"><span style="color: #111111;">Qua bài này mình đã giới thiệu cho các bạn cách </span><span style="color: red;">Install </span></span></span></span><span style="background-color: white; font-family: times, "times new roman", serif; font-size: 16px; letter-spacing: -0.048px;"><span style="color: red;">package control </span>và<span style="color: red;"> </span></span><span style="background-color: white; color: #111111; font-family: times, "times new roman", serif; font-size: small;">các </span><span style="background-color: white; font-family: times, "times new roman", serif; font-size: small;"><span style="color: red;">Plugin hay</span></span><span style="background-color: white; color: #111111; font-family: times, "times new roman", serif; font-size: small;"> cho sublime text 3, các bạn thấy bài viết thiếu plugin nào phù hợp với Dev Web thì hãy cho mình xin góp ý ở phần bình luận nhé ! Và đây cũng là bài viết mình tổng hợp lại những plugin mà mình đang sử dụng cảm thấy rất hữu ích.</span></div>
</h3>
<div>
<span style="box-sizing: inherit; font-weight: bolder;"><br /></span></div>

Những Plugin sublime text cần thiết cho Web Developers

Sublime Text Sublime text là một trong những trình biên tập code có sẵn phổ biến nhất hiện nay . Nó được yêu mến bởi nhiều lập trình viên...

Hướng Dẫn Active JetBrains PhpStorm 10 2016.3 License Key Final

<div class="home-descx" style="background-color: white; box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
<div class="tl-post-meta" style="box-sizing: border-box; margin-bottom: 15px; overflow: hidden; padding: 5px 0px 0px;">
<img alt="Hướng Dẫn Active JetBrains PhpStorm 10 2016.1 License Key Final " src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhap6dFW5A-CZP8Jrh4_9jmtar84KGxjKG89M3U39eAUpC5s8zaGTjOvOJBlADDoFWXHGTC7FPUP4ZFLsVKlXDgPImPCevLIf7RUZBEONGX6c7chWCBqXZR-xD2A93hHWSk44dt9ZBSD4Y/s1600/PHPStorm10.png" style="border: none; box-sizing: border-box; max-width: 100%; position: relative; text-align: center;" /></div>
</div>
<div class="post-body entry-content" id="post-body-2767305826816457909" style="background-color: white; box-sizing: border-box; line-height: 1.7em !important; width: 765px;">
<div itemprop="articleBody" style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
<div style="box-sizing: border-box;">
<strong style="box-sizing: border-box;">PhpStorm</strong> là phần mềm nổi tiếng và rất được phổ biến trên toàn thế giới là một PHP IDE chuyên nghiệp, hỗ trợ nhiều ngôn ngữ lập trình. PhpStorm cung cấp bộ code completion thông minh, dể dàng điều hướng và kiểm tra lỗi nhanh chóng. Ứng dụng này được cải thiện theo thời gian và đội ngũ phát triển ra mắt nhiều phiên bản hơn theo nhu cầu.<br />
Đơn giản và an toàn tùy chọn để kích hoạt IDE PHPStorm cho các phiên bản 7/8/9/10. Nó phù hợp cho tất cả các sản phẩm.</div>
<div style="box-sizing: border-box; text-align: center;">
<br /></div>
<div style="box-sizing: border-box;">
<strong style="box-sizing: border-box;">Hướng dẫn kích hoạt PHPStorm 10:</strong><br />
<strong style="box-sizing: border-box;">Bước 1</strong>: Mở PhpStorm lên<br />
<strong style="box-sizing: border-box;">Bước 2</strong>: Trên màn hình chọn Help -> Register và check vào License server<br />
<strong style="box-sizing: border-box;">Bước 3</strong>: Copy 1 trong 10 đường dẫn sau</div>
<div style="box-sizing: border-box;">
<br /></div>
<div style="box-sizing: border-box;">
<strong style="box-sizing: border-box;">http://idea.qinxi1992.cn </strong><br />
<strong style="box-sizing: border-box;">http://114.215.133.70:41017</strong><br />
<strong style="box-sizing: border-box;">http://jetbrains.tencent.click</strong><br />
<strong style="box-sizing: border-box;">http://idea.lanyus.com</strong><br />
<strong style="box-sizing: border-box;">http://172.245.22.235:1017</strong></div>
<div style="box-sizing: border-box;">
<span style="color: #171717; font-family: "arial" , "tahoma" , "verdana" , sans-serif;"><b>http://roothat.ru:1017</b></span></div>
<div style="box-sizing: border-box;">
<span style="color: #171717; font-family: "arial" , "tahoma" , "verdana" , sans-serif;"><b>http://jetbrains.tencent.click</b></span></div>
<div style="box-sizing: border-box;">
<span style="color: #171717; font-family: "arial" , "tahoma" , "verdana" , sans-serif;"><b>http://idea.imsxm.com</b></span></div>
<strong style="box-sizing: border-box;">http://jetbrains.tech</strong><br />
<strong style="box-sizing: border-box;">http://idea.imsxm.com</strong></div>
<div itemprop="articleBody" style="box-sizing: border-box;">
<b style="color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;"><br /></b>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
và dán vào ô dưới License server address</div>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
<br /></div>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9bVXURVoZBNrBHYuxb9RaWRVcpAFmdxBxIGMIJE68MsS0R95slTdhMI5-mMkJPyaUIZpDVf1dVIkQl4XEdPd8gBtQVFTSSE-HSpBpvVq_x9BmfVcrTgaVOhcgo2qAC4v45M9Idev2iUVj/s1600/license.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="434" data-original-width="422" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9bVXURVoZBNrBHYuxb9RaWRVcpAFmdxBxIGMIJE68MsS0R95slTdhMI5-mMkJPyaUIZpDVf1dVIkQl4XEdPd8gBtQVFTSSE-HSpBpvVq_x9BmfVcrTgaVOhcgo2qAC4v45M9Idev2iUVj/s320/license.png" width="311" /></a></div>
<br /></div>
<div style="box-sizing: border-box;">
</div>
<div style="text-align: center;">
<span style="color: #222222; font-family: "open sans" , sans-serif;"><span style="font-size: 14px;"><br /></span></span></div>
<strong style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">Bước 4</strong><span style="color: #222222; font-family: "open sans" , sans-serif;"><span style="font-size: 14px;">: Nhấn OK và khởi động lại PhpStorm và cảm nhận :)</span></span><br />
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
Nếu không sử dụng được thì bạn chuyển sang Activation code và nhập mã code dưới đây vào</div>
<blockquote style="border-left: 3px solid rgb(17, 151, 255); box-sizing: border-box; color: #888888; font-family: "Open Sans", sans-serif; font-size: 14px; font-style: italic; line-height: 26px; margin: 15px; padding: 10px 20px;">
CNEKJPQZEX-eyJsaWNlbnNlSWQiOiJDTkVLSlBRWkVYIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiIiwiYXNzaWduZWVFbWFpbCI6IiIsImxpY2Vuc2VSZXN0cmljdGlvbiI6IkZvciBlZHVjYXRpb25hbCB1c2Ugb25seSIsImNoZWNrQ29uY3VycmVudFVzZSI6ZmFsc2UsInByb2R1Y3RzIjpbeyJjb2RlIjoiQUMiLCJwYWlkVXBUbyI6IjIwMTgtMDEtMzAifSx7ImNvZGUiOiJETSIsInBhaWRVcFRvIjoiMjAxOC0wMS0zMCJ9LHsiY29kZSI6IklJIiwicGFpZFVwVG8iOiIyMDE4LTAxLTMwIn0seyJjb2RlIjoiUlMwIiwicGFpZFVwVG8iOiIyMDE4LTAxLTMwIn0seyJjb2RlIjoiV1MiLCJwYWlkVXBUbyI6IjIwMTgtMDEtMzAifSx7ImNvZGUiOiJEUE4iLCJwYWlkVXBUbyI6IjIwMTgtMDEtMzAifSx7ImNvZGUiOiJSQyIsInBhaWRVcFRvIjoiMjAxOC0wMS0zMCJ9LHsiY29kZSI6IlBTIiwicGFpZFVwVG8iOiIyMDE4LTAxLTMwIn0seyJjb2RlIjoiREMiLCJwYWlkVXBUbyI6IjIwMTgtMDEtMzAifSx7ImNvZGUiOiJEQiIsInBhaWRVcFRvIjoiMjAxOC0wMS0zMCJ9LHsiY29kZSI6IlJNIiwicGFpZFVwVG8iOiIyMDE4LTAxLTMwIn0seyJjb2RlIjoiUEMiLCJwYWlkVXBUbyI6IjIwMTgtMDEtMzAifSx7ImNvZGUiOiJDTCIsInBhaWRVcFRvIjoiMjAxOC0wMS0zMCJ9XSwiaGFzaCI6IjUxOTU1OTMvMCIsImdyYWNlUGVyaW9kRGF5cyI6MCwiYXV0b1Byb2xvbmdhdGVkIjpmYWxzZSwiaXNBdXRvUHJvbG9uZ2F0ZWQiOmZhbHNlfQ==-QOxwjWvRwJz6vo6J6adC3CJ4ukQHosbPYZ94URUVFna/Rbew8xK/M5gP3kAaPh6ZDveFdtMR1UBoumq3eCwXtXM3U3ls5noB4LIr+QplVlCj2pK5uNq7g/feyNyQcHpSXtvhIOnXDBLOecB05DOsxzm0p7ulGGJoAInmHeb9mc0eYjqc4RPpUQfh6HSYBnvEnKMlLF5bz4KEtzmsvvgA55CwzwQ3gRitm5Q/wUT7AQCBdjmBfNUjKVQL6TSjSDPp56FUdEs4Aab8LqstA2DIMbxocO64rvytmcUeIwu8Mi5uq87KQP5AQMSMYb59Inbd+dmVfx5cJo3fRS4/5s3/Hg==-MIIEPjCCAiagAwIBAgIBBTANBgkqhkiG9w0BAQsFADAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBMB4XDTE1MTEwMjA4MjE0OFoXDTE4MTEwMTA4MjE0OFowETEPMA0GA1UEAwwGcHJvZDN5MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxcQkq+zdxlR2mmRYBPzGbUNdMN6OaXiXzxIWtMEkrJMO/5oUfQJbLLuMSMK0QHFmaI37WShyxZcfRCidwXjot4zmNBKnlyHodDij/78TmVqFl8nOeD5+07B8VEaIu7c3E1N+e1doC6wht4I4+IEmtsPAdoaj5WCQVQbrI8KeT8M9VcBIWX7fD0fhexfg3ZRt0xqwMcXGNp3DdJHiO0rCdU+Itv7EmtnSVq9jBG1usMSFvMowR25mju2JcPFp1+I4ZI+FqgR8gyG8oiNDyNEoAbsR3lOpI7grUYSvkB/xVy/VoklPCK2h0f0GJxFjnye8NT1PAywoyl7RmiAVRE/EKwIDAQABo4GZMIGWMAkGA1UdEwQCMAAwHQYDVR0OBBYEFGEpG9oZGcfLMGNBkY7SgHiMGgTcMEgGA1UdIwRBMD+AFKOetkhnQhI2Qb1t4Lm0oFKLl/GzoRykGjAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBggkA0myxg7KDeeEwEwYDVR0lBAwwCgYIKwYBBQUHAwEwCwYDVR0PBAQDAgWgMA0GCSqGSIb3DQEBCwUAA4ICAQC9WZuYgQedSuOc5TOUSrRigMw4/+wuC5EtZBfvdl4HT/8vzMW/oUlIP4YCvA0XKyBaCJ2iX+ZCDKoPfiYXiaSiH+HxAPV6J79vvouxKrWg2XV6ShFtPLP+0gPdGq3x9R3+kJbmAm8w+FOdlWqAfJrLvpzMGNeDU14YGXiZ9bVzmIQbwrBA+c/F4tlK/DV07dsNExihqFoibnqDiVNTGombaU2dDup2gwKdL81ua8EIcGNExHe82kjF4zwfadHk3bQVvbfdAwxcDy4xBjs3L4raPLU3yenSzr/OEur1+jfOxnQSmEcMXKXgrAQ9U55gwjcOFKrgOxEdek/Sk1VfOjvS+nuM4eyEruFMfaZHzoQiuw4IqgGc45ohFH0UUyjYcuFxxDSU9lMCv8qdHKm+wnPRb0l9l5vXsCBDuhAGYD6ss+Ga+aDY6f/qXZuUCEUOH3QUNbbCUlviSz6+GiRnt1kA9N2Qachl+2yBfaqUqr8h7Z2gsx5LcIf5kYNsqJ0GavXTVyWh7PYiKX4bs354ZQLUwwa/cG++2+wNWP+HtBhVxMRNTdVhSm38AknZlD+PTAsWGu9GyLmhti2EnVwGybSD2Dxmhxk3IPCkhKAK+pl0eWYGZWG3tJ9mZ7SowcXLWDFAk0lRJnKGFMTggrWjV8GYpw5bq23VmIqqDLgkNzuoog==</blockquote>
<br />
<b>Hoặc </b><br />
<blockquote class="tr_bq" style="box-sizing: border-box; text-align: left;">
<span style="color: #222222; font-family: "open sans" , sans-serif;"><span style="font-size: 14px;">BIG3CLIK6F-eyJsaWNlbnNlSWQiOiJCSUczQ0xJSzZGIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiIiwiYXNzaWduZWVFbWFpbCI6IiIsImxpY2Vuc2VSZXN0cmljdGlvbiI6IkZvciBlZHVjYXRpb25hbCB1c2Ugb25seSIsImNoZWNrQ29uY3VycmVudFVzZSI6ZmFsc2UsInByb2R1Y3RzIjpbeyJjb2RlIjoiQUMiLCJwYWlkVXBUbyI6IjIwMTctMTEtMjMifSx7ImNvZGUiOiJETSIsInBhaWRVcFRvIjoiMjAxNy0xMS0yMyJ9LHsiY29kZSI6IklJIiwicGFpZFVwVG8iOiIyMDE3LTExLTIzIn0seyJjb2RlIjoiUlMwIiwicGFpZFVwVG8iOiIyMDE3LTExLTIzIn0seyJjb2RlIjoiV1MiLCJwYWlkVXBUbyI6IjIwMTctMTEtMjMifSx7ImNvZGUiOiJEUE4iLCJwYWlkVXBUbyI6IjIwMTctMTEtMjMifSx7ImNvZGUiOiJSQyIsInBhaWRVcFRvIjoiMjAxNy0xMS0yMyJ9LHsiY29kZSI6IlBTIiwicGFpZFVwVG8iOiIyMDE3LTExLTIzIn0seyJjb2RlIjoiREMiLCJwYWlkVXBUbyI6IjIwMTctMTEtMjMifSx7ImNvZGUiOiJEQiIsInBhaWRVcFRvIjoiMjAxNy0xMS0yMyJ9LHsiY29kZSI6IlJNIiwicGFpZFVwVG8iOiIyMDE3LTExLTIzIn0seyJjb2RlIjoiUEMiLCJwYWlkVXBUbyI6IjIwMTctMTEtMjMifSx7ImNvZGUiOiJDTCIsInBhaWRVcFRvIjoiMjAxNy0xMS0yMyJ9XSwiaGFzaCI6IjQ3NzU1MTcvMCIsImdyYWNlUGVyaW9kRGF5cyI6MCwiYXV0b1Byb2xvbmdhdGVkIjpmYWxzZSwiaXNBdXRvUHJvbG9uZ2F0ZWQiOmZhbHNlfQ==-iygsIMXTVeSyYkUxAqpHmymrgwN5InkOfeRhhPIPa88FO9FRuZosIBTY18tflChACznk3qferT7iMGKm7pumDTR4FbVVlK/3n1ER0eMKu2NcaXb7m10xT6kLW1Xb3LtuZEnuis5pYuEwT1zR7GskeNWdYZ0dAJpNDLFrqPyAPo5s1KLDHKpw+VfVd4uf7RMjOIzuJhAAYAG+amyivQt61I9aYiwpHQvUphvTwi0X0qL/oDJHAQbIv4Qwscyo4aYZJBKutYioZH9rgOP6Yw/sCltpoPWlJtDOcw/iEWYiCVG1pH9AWjCYXZ9AbbEBOWV71IQr5VWrsqFZ7cg7hLEJ3A==-MIIEPjCCAiagAwIBAgIBBTANBgkqhkiG9w0BAQsFADAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBMB4XDTE1MTEwMjA4MjE0OFoXDTE4MTEwMTA4MjE0OFowETEPMA0GA1UEAwwGcHJvZDN5MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxcQkq+zdxlR2mmRYBPzGbUNdMN6OaXiXzxIWtMEkrJMO/5oUfQJbLLuMSMK0QHFmaI37WShyxZcfRCidwXjot4zmNBKnlyHodDij/78TmVqFl8nOeD5+07B8VEaIu7c3E1N+e1doC6wht4I4+IEmtsPAdoaj5WCQVQbrI8KeT8M9VcBIWX7fD0fhexfg3ZRt0xqwMcXGNp3DdJHiO0rCdU+Itv7EmtnSVq9jBG1usMSFvMowR25mju2JcPFp1+I4ZI+FqgR8gyG8oiNDyNEoAbsR3lOpI7grUYSvkB/xVy/VoklPCK2h0f0GJxFjnye8NT1PAywoyl7RmiAVRE/EKwIDAQABo4GZMIGWMAkGA1UdEwQCMAAwHQYDVR0OBBYEFGEpG9oZGcfLMGNBkY7SgHiMGgTcMEgGA1UdIwRBMD+AFKOetkhnQhI2Qb1t4Lm0oFKLl/GzoRykGjAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBggkA0myxg7KDeeEwEwYDVR0lBAwwCgYIKwYBBQUHAwEwCwYDVR0PBAQDAgWgMA0GCSqGSIb3DQEBCwUAA4ICAQC9WZuYgQedSuOc5TOUSrRigMw4/+wuC5EtZBfvdl4HT/8vzMW/oUlIP4YCvA0XKyBaCJ2iX+ZCDKoPfiYXiaSiH+HxAPV6J79vvouxKrWg2XV6ShFtPLP+0gPdGq3x9R3+kJbmAm8w+FOdlWqAfJrLvpzMGNeDU14YGXiZ9bVzmIQbwrBA+c/F4tlK/DV07dsNExihqFoibnqDiVNTGombaU2dDup2gwKdL81ua8EIcGNExHe82kjF4zwfadHk3bQVvbfdAwxcDy4xBjs3L4raPLU3yenSzr/OEur1+jfOxnQSmEcMXKXgrAQ9U55gwjcOFKrgOxEdek/Sk1VfOjvS+nuM4eyEruFMfaZHzoQiuw4IqgGc45ohFH0UUyjYcuFxxDSU9lMCv8qdHKm+wnPRb0l9l5vXsCBDuhAGYD6ss+Ga+aDY6f/qXZuUCEUOH3QUNbbCUlviSz6+GiRnt1kA9N2Qachl+2yBfaqUqr8h7Z2gsx5LcIf5kYNsqJ0GavXTVyWh7PYiKX4bs354ZQLUwwa/cG++2+wNWP+HtBhVxMRNTdVhSm38AknZlD+PTAsWGu9GyLmhti2EnVwGybSD2Dxmhxk3IPCkhKAK+pl0eWYGZWG3tJ9mZ7SowcXLWDFAk0lRJnKGFMTggrWjV8GYpw5bq23VmIqqDLgkNzuoog==</span></span></blockquote>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px; text-align: center;">
<br /></div>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px; text-align: center;">
<img alt="Hướng Dẫn Active JetBrains PhpStorm 10 2016.1 License Key Final " src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGxJG7n75vT0qf06h19x5edPcgsMahQNYECv10t0HXnVVDWg73qOF2U6iZLBP1zTbKiKr2rX8odHI_JP41Ex_sc30RdwfBimjGb98ZBlemvfu8ARQZli8Dly68q5qRFtb6uwtZzyglfBk/s1600/phpstorm.png" style="border: none; box-sizing: border-box; max-width: 100%; position: relative;" /></div>
<div style="box-sizing: border-box; color: #222222; font-family: "Open Sans", sans-serif; font-size: 14px;">
<br /></div>
</div>
</div>

Hướng Dẫn Active JetBrains PhpStorm 10 2016.3 License Key Final

PhpStorm là phần mềm nổi tiếng và rất được phổ biến trên toàn thế giới là một PHP IDE chuyên nghiệp, hỗ trợ nhiều ngôn ngữ lập trình...

Đôi Nét về Angular 2.0

<div style="border: 0px; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white; color: #222222; font-family: "pt serif" , "georgia" , "helvetica neue" , "arial" , sans-serif;">Bắt đầu với những tính năng mới</span></div>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Hãy xem phiên bản này đem đến cho chúng ta những lợi ích và tính năng gì mới?</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-mobile" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: inherit; font-stretch: normal; left: 50px; line-height: 1; margin: -40px 0px 0px -17px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Phát triển các ứng dụng di động</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Các thư viện modul và định tuyển trong angular được nạp ưu tiên giúp ứng dụng của bạn được nạp đầy đủ các thư viện cần thiết, kể cả khi sử dụng các mạng có băng thông thấp cũng không cần phải chờ đợi lâu. Các tính năng đầu tiên trên di động bao gồm hỗ trợ cảm ứng, điều chỉnh hiệu suất và cách sử dụng tối thiểu bộ nhớ trên nền tảng di động, và các thành phần thiết kế giao diện người dùng thích nghi với nhiều thiết bị.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-forward" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -30px 0px 0px -20px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Future Ready</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Angular phiên bản 2.0 được viết trong nền tảng ES6 (ECMAScript 6), với việc bổ sung thêm các kiểu và chú thích. ES6 cho phép Angular được hưởng lợi từ các sản phẩm tốt nhất của JavaScript giúp mã viết ra dễ đọc và rõ ràng hơn.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-heart" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -30px 0px 0px -30px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Phát triển linh hoạt hơn</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Sự lựa chọn ngôn ngữ nào là tùy thuộc vào bạn. Ngoài việc cung cấp hỗ trỡ đầy đủ tính năng của ES6 và TypeScript, Angular 2.0 vẫn hoạt động tốt ngay cả trên các nền tảng ES5, Dart, CoffeScript, và các ngôn ngữ khác để biên dịch JavaScript. Như vậy đừng quá lo lắng về môi trường phát triển Angular 2.0.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-tachometer" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -38px 0px 0px -29px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Tốc độ và hiệu năng</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Tốc độ được cải thiện nhanh hơn gấp 5 lần, nhờ tính năng tuning Của JavaScript. Nếu bạn muốn đảm bảo tốc độ cho ứng dụng hiện tại của bạn thì Angular phiên bản 2.0 sẽ là lựa chọn tốt nhất.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-code" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -32px 0px 0px -32px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Đơn giản và dễ viết</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Ngôn ngữ phù hợp với ngữ nghĩa, cú pháp viết dễ dàng. Giảm độ phức tạp cho nhóm của bạn: cấu trúc mới đơn giản, dễ học, nhiều template mẫu.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-random fa-rotate-270" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -31px 0px 0px -27px; padding: 0px; position: absolute; top: 50px; transform: rotate(270deg); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Đơn giản việc định tuyến</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Đơn giản trong việc định tuyến các URL. Angular 2.0 hỗ trợ nav, animated hiệu ứng, và lazy loading cho trình duyệt di động. Nếu bạn đang sử dụng route ở phiên bản trước, bạn cũng có thể dễ dàng chuyển đổi sang angular 2.0.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-film" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -30px 0px 0px -32px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Hiệu ứng ANIMATIONS</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Hỗ trợ các hiệu animation trên thiết bị di động và ứng dụng destop bằng cách sử dụng các event Angular. Bạn có thể sử dụng CSS, JavaScript và các dịch vụ cung cấp animate khi người dùng tương tác. Tính năng animations được sắp xếp trên một timeline.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-th-large" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -28px 0px 0px -28px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">INJECTION</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Angular 2.0 tạo liên hết mạnh mẽ, đơn giản để sử dụng khai báo injection. Khai báo injection giúp bạn viết kiểm thử dễ dàng hơn.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-file" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -30px 0px 0px -23px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Hỗ trợ các thành phần web</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Cung cấp thêm các thành phần web, được xây dựng bằng cách sử dụng các thư việc khác, cho phép bạn truyền dữ liệu qua lại dễ dàng. Các thành phần Angular sử dụng các tiêu chuẩn web HTML 5 trong trình duyệt hỗ trợ.</span></div>
<div class="sticker" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 1000px; border: 0px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 2px; color: #cfd8dc; float: left; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 80px; font-stretch: inherit; font-variant-numeric: inherit; height: 100px; line-height: 100px; margin: 0px 0.2em 0px 0px; padding: 0px; position: relative; text-align: center; vertical-align: baseline; width: 100px;">
<span class="fa fa-male" style="border: 0px; display: inline-block; font-family: "fontawesome"; font-size: 60px; font-stretch: normal; left: 50px; line-height: 1; margin: -30px 0px 0px -17px; padding: 0px; position: absolute; top: 50px; transform: translate(0px , 0px); vertical-align: baseline; z-index: 1;"></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Hỗ trợ đa ngôn ngữ</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Dễ dàng đưa ứng dụng trở nên dễ tiếp cận thông qua trình đọc màn hình và các thiết bị trợ giúp bằng cách tự tạo ra các thuộc <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">aria</code> thích hợp.</span></div>
<h2 style="background-attachment: initial; background-clip: initial; background-image: url("data:image/png; background-origin: initial; background-position: left top; background-repeat: repeat-x; background-size: initial; border: 0px; color: #222222; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0.8em 0px 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Bắt đầu với Angular 2.0</span></h2>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">1. Tạo một Project cho Angular2.0</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Bài viết này sẽ hướng dẫn này bạn làm thế nào viết một thành phần angular sử dụng trình biên dịch TypeScript. Bạn có thể lựa chọn một ngôn ngữ mà bạn quen thuộc như ES5, dark.</span></div>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Mục tiêu của bài tập là viết một thành phần Angular để in ra một string. Bài tập này yêu cầu bạn đã cài đặt <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">node</code> và <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">npm</code> để làm việc.</span></div>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Đầu tiên, tạo mới một thư mục để chứa Bài tập. Tất cả dòng lệnh nên được chạy trong thư mục này.</span></div>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Để sử dụng tốt các tính năng của trình biên dịch TypeScript, yêu cầu bạn đọc thêm trình biên dịch JavaScript tại DefinitelyTyped. Và đọc thêm về <span style="color: #267924; font-family: inherit;"><span style="border-bottom: 1px solid; border-image: initial; border-left-color: initial; border-left-style: initial; border-right-color: initial; border-right-style: initial; border-top-color: initial; border-top-style: initial; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; transition: color 0.3s; white-space: pre-wrap;">ES6 - và những khái niệm mới cần biết</span></span>.</span></div>
<h4 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Cài đặt môt trường.</span></h4>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="python" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">sudo</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">npm</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">install</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">g</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">tsd</span><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">@</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">^</span><span class="mf" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">0.6</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="mi" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">0</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">sudo</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">tsd</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">install</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">angular2</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">es6</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">promise</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">rx</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">rx</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">lite</span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Sau đó, vào thư mục chứa project, tạo mới 2 file <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">index.html</code> và <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">app.ts</code></span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="python" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">touch</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">app</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">ts</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">touch</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">index</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">html</span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Sau khi cài đặt thành công thư mục của bạn sẽ trông như thế này:</span></div>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;"><img alt="5-phut-voi-angular2-setup-moi-truong" src="https://123blog.github.io/images/javascript/5-phut-voi-angular2-setup-moi-truong.png" style="border-radius: 0.3em; border: none; box-shadow: rgba(0, 0, 0, 0.14902) 0px 1px 4px; box-sizing: border-box; cursor: pointer; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 100%; padding: 0px; vertical-align: baseline;" /></span></div>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">2. Chạy trình biên dịch TypeScript</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Với mã TypeScript ở trên, trình duyệt sẽ không thể hiểu được, vì vậy chúng ta cần chạy một trình biên dịch để dịch nó thành mã JavaScript mà trình duyệt có thể hiểu được. Chúng ta sẽ bắt đầu sử dụng trình biên dịch TypeScript để biên dịch mã trong file <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">app.ts</code>.</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="python" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">sudo</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">npm</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">install</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">g</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">typescript</span><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">@</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">^</span><span class="mf" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1.5</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="mi" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">0</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">beta</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">tsc</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">--</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">watch</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">m</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">commonjs</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">t</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">es5</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">--</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">emitDecoratorMetadata</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">app</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">ts</span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">3. Import thư viện Angular</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Mở file <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">app.ts</code> khai báo đoạn code sau:</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="text" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span class="line" style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">/// <reference path="typings/angular2/angular2.d.ts" />
</span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Sử dụng cú pháp ES6, các thư viện sẽ tự động được nạp khi chạy ứng dụng.</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="js" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span class="line" style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="kr" style="border: 0px; color: rgb(211 , 54 , 130); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">import</span> <span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">{</span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Component</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">,</span> <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">View</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">,</span> <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">bootstrap</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">}</span> <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">from</span> <span class="s1" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">'angular2/angular2'</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">;</span>
</span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">4. Khai báo một component</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Trong file app.ts thêm đoạn code sau:</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">3</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">4</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">5</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">6</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">7</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">8</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">9</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">10</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">11</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">12</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">13</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">14</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 749px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="js" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="c1" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: italic; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">// Annotation section</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">@</span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Component</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">({</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">selector</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">:</span> <span class="s1" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">'my-app'</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">})</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">@</span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">View</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">({</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">template</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">:</span> <span class="s1" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">'<h1>Hello </h1>'</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">})</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="c1" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: italic; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">// Component controller</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="kr" style="border: 0px; color: rgb(211 , 54 , 130); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">class</span> <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">MyAppComponent</span> <span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">{</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">name</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">:</span> <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">string</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">;</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">constructor</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">()</span> <span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">{</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="k" style="border: 0px; color: rgb(203 , 75 , 22); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">this</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">name</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">=</span> <span class="s1" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">'Hello Angular2.0'</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">;</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">}</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">}</span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h4 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">@Component và @View</span></h4>
<ul style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; list-style-image: initial; list-style-position: initial; margin: 0px 0px 1.5em 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<li style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="background-color: white;">Một @Component định nghĩa một tag HTML hay một Selector trong CSS</span></li>
<li style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="background-color: white;">@View khai báo template hiện thị cho component.</span></li>
</ul>
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">5. Bootstrap</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Cuối file <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">app.ts</code> gọi tới hàm bootstrap()</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="js" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span class="line" style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">bootstrap</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">(</span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">MyAppComponent</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">);</span>
</span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">6. Khai báo HTML</span></h3>
<div style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin-bottom: 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="background-color: white;">Trong tag <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">head</code> khai báo như sau:</span></div>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">3</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">4</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">5</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">6</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">7</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">8</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">9</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">10</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">11</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 869px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="html" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><html></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><head></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><title></span>Angular 2 Quickstart<span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></title></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><script </span><span class="na" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">src=</span><span class="s" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">"https://github.jspm.io/jmcriffey/bởe-traceur-runtime@0.0.87/traceur-runtime.js"</span><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">></script></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><script </span><span class="na" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">src=</span><span class="s" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">"https://code.angularjs.org/2.0.0-alpha.28/angular2.dev.js"</span><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">></script></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></head></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><body></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="c" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: italic; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><my-app></my-app></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">  <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></body></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></html></span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">7. Nạp component</span></h3>
<h4 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">JS</span></h4>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">3</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="html" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><head></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">    <span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><script </span><span class="na" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">src=</span><span class="s" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">"https://jspm.io/system@0.16.js"</span><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">></script></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></head></span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h4 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">Component</span></h4>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial !important; background-clip: initial !important; background-image: url("/images/noise.png?1433930727") !important; background-origin: initial !important; background-position: left top !important; background-repeat: initial !important; background-size: initial !important; border-bottom: none; border-image: initial; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44) !important; border-top: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em !important; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="html" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !important; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><my-app></my-app></span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><script></span><span class="nx" style="border: 0px; color: rgb(181 , 137 , 0); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">System</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="kr" style="border: 0px; color: rgb(211 , 54 , 130); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">import</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">(</span><span class="s1" style="border: 0px; color: rgb(42 , 161 , 152); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">'app'</span><span class="p" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">);</span><span class="nt" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></script></span>
</span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure><br />
<h3 style="border: 0px; color: #267924; font-family: "PT Serif", Georgia, "Helvetica Neue", Arial, sans-serif; font-size: 1.3em; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1em; padding: 0px; text-align: justify; text-rendering: optimizeLegibility; vertical-align: baseline;">
<span style="background-color: white;">8. Chạy thử trên localhost</span></h3>
<ul style="border: 0px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; list-style-image: initial; list-style-position: initial; margin: 0px 0px 1.5em 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<li style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="background-color: white;">Bạn cần cài đặt gói <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0.4em; border: 1px solid rgb(221, 221, 221); color: #555555; display: inline-block; font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; font-size: 0.8em; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.5em; margin: -1px 0px; padding: 0px 0.3em; vertical-align: baseline;">http-server</code></span></li>
</ul>
<br />
<figure class="code" style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(0, 0, 0, 0.0588235) 0px 0px 10px; color: #222222; font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; font-size: 18.4px; font-stretch: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px 0px 1.5em; padding: 0px; text-align: justify; vertical-align: baseline;"><figcaption style="background-attachment: initial; background-clip: initial; background-image: url("/images/code_bg.png?1433930727"); background-origin: initial; background-position: center top; background-repeat: repeat-x; background-size: initial; border-bottom-color: initial; border-bottom-style: initial; border-image: initial; border-left-color: rgb(165, 165, 165); border-left-style: solid; border-right-color: rgb(165, 165, 165); border-right-style: solid; border-top-color: rgb(203, 203, 203); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-width: 1px 1px 0px; color: #474747; font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: 2em; margin: 0px; padding: 0px; position: relative; text-align: center; text-shadow: rgb(203, 204, 204) 0px 1px 0px; vertical-align: baseline;"><span style="background-color: white; border: 0px; font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></span></figcaption><div class="highlight" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(5, 35, 43) !important; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0px; vertical-align: baseline;">
<table style="border-collapse: collapse; border-spacing: 0px; border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><tbody style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">
<tr style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><td class="gutter" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: middle;"><pre class="line-numbers" style="background-attachment: initial; background-clip: initial; background-image: url("about:blank"); background-origin: initial; background-position: left top; background-repeat: initial; background-size: initial; border-bottom: none; border-left: none; border-radius: 0px; border-right: 1px solid rgb(0, 35, 44); border-top: none; box-shadow: none; color: #93a1a1; font-family: menlo, monaco, "andale mono", "lucida console", "courier new", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0.8em; text-align: right; text-shadow: rgb(2, 16, 20) 0px -1px; vertical-align: baseline;"><span style="background-color: white;"><span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">1</span>
<span class="line-number" style="border: 0px; color: rgb(88 , 110 , 117); font-family: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">2</span>
</span></pre>
</td><td class="code" style="border: 0px; font-family: inherit; font-size: 18.4px; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; position: relative; vertical-align: middle; width: 757px;"><pre style="background-attachment: initial; background-clip: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 0px; border: none; box-shadow: none; color: #93a1a1; font-family: menlo, monaco, "andale mono", "lucida console", "courier new", monospace; font-size: 13px; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; overflow: auto; padding: 0px; vertical-align: baseline;"><code class="python" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; display: block; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1.45em; margin: 0px; overflow-x: auto; overflow-y: hidden; padding: 0.8em; vertical-align: baseline;"><span style="background-color: white;"><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="err" style="background-image: none; border: 0px; color: rgb(220 , 50 , 47); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">$</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">sudo</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">npm</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">install</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">g</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">http</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">server</span>
</span><span class="line" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">cd</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">angular2</span> <span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">&&</span> <span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">http</span><span class="o" style="border: 0px; font-family: inherit; font-stretch: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">-</span><span class="n" style="border: 0px; color: rgb(38 , 139 , 210); font-family: inherit; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">server</span></span></span></code></pre>
</td></tr>
</tbody></table>
</div>
</figure>

Đôi Nét về Angular 2.0

Bắt đầu với những tính năng mới Hãy xem phiên bản này đem đến cho chúng ta những lợi ích và tính năng gì mới? Phát triển các ứng dụng...

IT VO VAN TIEN

10 Packages Sublime Text cần thiết cho Frontend Developers

Những Plugin sublime text cần thiết cho Web Developers

Hướng Dẫn Active JetBrains PhpStorm 10 2016.3 License Key Final

Đôi Nét về Angular 2.0

Popular Posts

Blog Archive

Labels