
The article is a placeholder for Hello World code for EmberJS with Bootstrap. Those who want to get started with EmberJS can just copy and paste the code in an html file and get started. Among the scripts, you would also find the Bootstrap script and CSS files.
Following are, however, some of the observations to be noted:
- Dependency on JQuery: The primary reason for dependency on JQuery as cited by the Ember code developer in this page is DOM manipulation.
- Dependency on Handlebars template: This is the templating engine used by EmberJS.
- EmberJS App Initialization: One needs to an Ember app initiated using the code such as “var app = Ember.Application.create();”
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>EmberJS - Hello World</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/handlebarsjs/1.3.0/handlebars.min.js"></script>
<script src="http://builds.emberjs.com/release/ember.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script>
var app = Ember.Application.create();
</script>
</head>
<body>
<div class="container">
<div class="page-header" style="margin: 0">
<h1>Hello World</h1>
</div>
</div>
<script type="text/x-handlebars">
<div class="container">
<form class="form-horizontal" role="form" method="post" action="#">
<div class="form-group" style="padding-top:20px">
<label class="col-md-1 control-label">Name:</label>
<div class="col-md-2">
{{input type="text" value=name placeholder="Enter your name" class="form-control"}}
</div>
</div>
<div class="col-md-3">
<h3>Hello, {{name}}</h3>
</div>
</div>
</form>
</script>
</body>
</html>
…
[adsenseyu1]
Latest posts by Ajitesh Kumar (see all)
- Online US Degree Courses & Programs in AI / Machine Learning - May 29, 2023
- AIC & BIC for Selecting Regression Models: Formula, Examples - May 28, 2023
- Azure OpenAI Service Details & Pricing Info - May 27, 2023
Leave a Reply