Mengintegrasikan Bootstrap CDN Dengan Angular 4

Di artikel kali ini saya akan masih membahas mengenai angular 4 yaitu ,Â Mengintegrasikan Bootstrap CDN Dengan Angular 4.
Angular 4 adalah framework bagi frontend diantara yang terbaik dan terbesar penggunaannya , karena diantara alasanya angular di backup seketika oleh Google. Â Nah bagi merancang framework ini semakin keren kita mesti mengintegrasikanya dengan diantara framework css memiliki tampilan yang dinamis terbaik pun yaitu bootstrap.

Gimana caranya ? simak berikut ini.

Di sini saya menggunakan bootstrap CDN (content delivery network) atau bootstrap online, sebetulnya angular 4 ada module bootstrap dan tinggal seting saja di bagian node_module nya tetapi akan itu terasa sedikit repot karenanya dari itu saya menggunakan bootstrap CDN. oke kita mulai.

1. Buka blog bootstrap CDN di link ini
Bootstrap.min.css

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css

Bootstrap.min.js

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css

1	https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css

Lalu buka project folder angularnya lalu ke bagian src/index.html ubah jadi seperti ini :

<!doctype html><br />
<html lang=”en”><br />
<head><br />
  <meta charset=”utf-8″><br />
  <title>BukuResep</title><br />
  <base href=”/”></p>
<p>  <meta name=”viewport” content=”width=device-width, initial-scale=1″><br />
  <link rel=”icon” type=”image/x-icon” href=”favicon.ico”><br />
  <link rel=”stylesheet” type=”text/css” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css”><br />
</head><br />
<body><br />
  <app-root></app-root></p>
<p>  <script src=”https://code.jquery.com/jquery-3.2.1.min.jss”></script><br />
  <script src=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js”></script><br />
</body><br />
</html>

<!doctype html>

<head>

<title>BukuResep</title>

</head>

<body>

<app–root></app–root>

</body>

</html>

Oke itulahÂ Mengintegrasikan Bootstrap CDN Dengan Angular 4

sumber :kursuswebprogramming.com/blog/

(Visited 5 times, 1 visits today)

Leave a Reply Cancel reply