Installing components

To develop our real-world project, we need to install a few components and set up our first layout.

These are all the components you need to download:

Bootstrap: https://github.com/twbs/bootstrap/releases/download/v3.2.0/bootstrap-3.2.0-dist.zip
jQuery: https://code.jquery.com/jquery-2.1.1.min.js
KnockoutJS: http://knockoutjs.com/downloads/knockout-3.2.0.js

Since we just work on the client side in the first chapters, we can mock data in the client and will not need a server side for now. So we can choose any place in our computer to start our project. I recommend you use the environment you usually employ to do your projects.

To start, we create a folder called ko-cart and then create three folders and a file inside it:

In the css folder, we will put all our css.
In the js folder, we will put all our JavaScript.
In the fonts folder, we will put all the font files needed by the Twitter Bootstrap framework.
Create an index.html file.

Now you should set up your files the same way as shown in the following screenshot:

The initial folder structure

Then we should set the content of the index.html file. Remember to set all the links to the files we will need using the <script> and <link> tags:

<!DOCTYPE html>
<html>
<head>
  <title>KO Shopping Cart</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>
<body>
  <script type="text/javascript" src="js/vendors/jquery.min.js">
  </script>
  <script type="text/javascript" src="js/vendors/bootstrap.min.js">
  </script>
  <script type="text/javascript" src="js/vendors/knockout.debug.js">
  </script>
</body>
</html>

With these lines of code, we have all we need to start our application.

Tech Concepts

Programming languages

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Knockout.JS Essentials

By : Ferrando

Knockout.JS Essentials

By: Ferrando

Overview of this book

Installing components

Knockout.JS Essentials

By : Ferrando

Knockout.JS Essentials

By: Ferrando

Overview of this book

Installing components

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access