MESUT ÇAKIR | ASP.NET MVC

Asp.NET MVC & NodeJS & AngularJS Geçişi | 2- Node/Javascript ile Todo Uygulaması

Merhaba Arkadaşlar,

Asp.NET MVC & NodeJS & AngularJS Geçişi dersimizin 2. bölümününü sizlerle paylaştım. Bu eğitimde MVC üzerinde C# ile gerçekleştirmiş olduğumuz işlemlerimizi NodeJs üzerinde javascript ile gerçekleştirdik. Çalışma ile ilgili kaynak dosyaları indirebilirsiniz.[TodoApp_NodeJs.zip (2,59 kb)]

 

Asp.NET MVC & NodeJS & AngularJS Geçişi | 1- C# ile Todo Uygulaması

Merhaba arkadaşlar, ASP.NET MVC eğitimlerinin ardından sizlere NodeJS ile ilgili eğitimler vermeye başlamak istedim. Bu bağlamda sizlere önce bir basit MVC uygulaması hazırladım. Sonrasındaki derslerde NodeJs ile ilgili hangi yerlere işaret ettiğini öğreniyor olacağız. Eğitimlerin sonuna geldiğimizde MVC ve NodeJS ile uygulama geliştirme ve yayınlama ile ilgili konuları işliyor olacağız. Eğitim'de belirtilen HTML Kaynağı aşağıdadır. Uygulamanın tamamını bu linkten indirebilirsiniz. [TodoApp.zip (12,46 kb)]

<html>
<head>
    <title>Simple Todo App</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
</head>
<body class="container">
<div>
    <br />
</div>
<div class="col-md-12">
    <div class="input-group">
        <input type="text" class="form-control" placeholder="Todo ">
        <span class="input-group-btn">
            <button class="btn btn-default" type="button">Add Todo</button>
        </span>
    </div>
    <h4>Todo List</h4>
    <div class="list-group">
        <a href="#" class="list-group-item active">First item</a>
        <a href="#" class="list-group-item">Second item</a>
        <a href="#" class="list-group-item">Third item</a>
    </div>
</div>
</body>
</html>