Over a million developers have joined DZone.

SQL Server and NoolJS: Getting Data From SQL Server

Check out NoolJS, a handy tool that helps you get data from a variety of databases in order to put it up on a website.

Build fast, scale big with MongoDB Atlas, a hosted service for the leading NoSQL database. Try it now! Brought to you in partnership with MongoDB.

NoolJS is a great framework to develop data-driven applications. It helps you get your data from   relational or NoSQL databases and displays it in a webpage — with minimal coding.  You don't need to worry about the data retrieval process or how to transmit that data to the client site. All these complex processes will be handled by NoolJS automatically.

How it Works

The server side of the framework runs on top of Node.jss and various database connectors, such as for SQL Server, MongoDB, PostreSQL, and MySQL. The communication layer is handled by socket-io and express-js.

The client side is powered by Angular-js.

In this tutorial, we will show you how to get the data from SQL Server, then display it on a webpage.

  1. If you don't have SQL Server installed on your computer, you can download SQLExpress for free.

  2.  Create the table "Users" and insert some records 
    create table users
    (userid int  identity(1,1),
    firstName varchar(100),
    lastName varchar(100),
    userName varchar(100)
    )
    
    insert into  users(firstName, lastName, userName)
    values('Jone', 'King', 'johnKing')
    insert into  users(firstName, lastName, userName)
    values('Jane', 'Paul', 'janepaul')
    insert into  users(firstName, lastName, userName)
    values('Steve', 'Peter', 'stevepeter')
    insert into  users(firstName, lastName, userName)
    values('Ann', 'Mark', 'annmark')
    
    select * from users

    Now, we have a table and data in our SQL Server database.

  3. Install NoolJS with npm:
    npm install nooljs -g


  4. Create a new NoolJS project by running:
    nooljs

    It will ask for a project name. Enter the project name (example: Tutorials2Sqldata). It will create a new folder for the project and a sample application.

  5. Go the new project folder:
    cd Tutorials2Sqldata

  6. Update the npm dependency packages:
    npm update 

  7. Go to the layout folder under this project and create a new file called "users-template.html." Then, open this file with your favorite editor (example Notepad++) . 
    <nl-template id="user-template" nl-parent="main-content" >
       <h1>Users</h1>
       <table nl-db-data="select userName, firstName, lastName from Users" nl-db-model="users">
           <tr> <td>User Name </td><td>First Name</td><td>Last Name</td></tr>
           <tr ng-repeat="x in users">
               <td>{{x.userName}}</td><td>{{x.firstName}}</td><td>{{x.lastName}}</td>
           </tr>
       </table>
    </nl-template>

  8. Open the file, index.html, add "user-template" as the default nl-default-template. 
    <html ng-app="myApp">
        <head>
            <meta charset="utf-8">
                <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
                    <link rel="stylesheet" href="http://code.ionicframework.com/1.3.1/css/ionic.min.css">
                        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"> </script>
                        <script src="https://cdn.socket.io/socket.io-1.3.7.js"> </script>
                        <script src="js/nooljsClient.js">
                        <script src="js/client.js"> </script>
    
                    </head>
                    <body>
                    <div id="top-content" nl-default-template="user-template">
            </div> 
        </body>
    </html>


  9. Open the file config >> connection.json. Enter the SQL Server connection information under the config section. 
    [
     {  "name":"sqlConn",
         "type":"sqlserver",
         "config":{"server": "localhost",
              "user": "admin",
              "password": "test123",
              "database": "userdb"
              }
       },
     .............

  10. Open the file config >> config.json. Add sqlConn as the default connection. 
    {"userid" : "UserId",
      "sessionTimeoutMinutes":60,
      "logout":"login",
     "defaultConnection": "sqlConn",
     "permission": {
      "connection":"jsonFile",
      "query" : "config/permision.json",
      "errorMessage": " You do not have permission to view this session."
    } }

  11. Open the browser and go to localhost:8080. You will see all the users on the screen.

For the full documentation, go to the GitHub page or download NoolJS from here.

Now it's easier than ever to get started with MongoDB, the database that allows startups and enterprises alike to rapidly build planet-scale apps. Introducing MongoDB Atlas, the official hosted service for the database on AWS. Try it now! Brought to you in partnership with MongoDB.

Topics:
web development ,database ,sql server ,nooljs

Published at DZone with permission of Chandru (Puva) Krishnar. See the original article here.

Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

SEE AN EXAMPLE
Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.
Subscribe

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}