1<!DOCTYPE html> 2<html> 3 <head> 4 <title>Get Started  | Sails.js</title> 5 6 <!-- Viewport mobile tag for sensible mobile support --> 7 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 8 9 <!-- Google fonts --> 10 <link href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i" rel="stylesheet"> 11 12 <!-- Typekit --> 13
13<script src="https://use.typekit.net/efp4ekk.js"></script>
13 14
14<script>try{Typekit.load({ async: false });}catch(e){}</script>
14 15 16 <meta name="google-site-verification" content="6HnJJqAkInT-Kv8bSMvtGDpaaCgKLmukQqrzJUqPAZg" /> 17 18 19 <meta name="description" content="Learn about installing Sails.js and Node.js, and get acquainted with some of Sails's major concepts, such as convention over configuration, loose coupling, and what Sails is and is not." /> 20 21 <meta name="author" content="The Sails Company" /> 22 23 24 25 26 27
27<script>
vendor: 359 bytes, lines 27-33
27 28 (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 29 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 30 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 31 })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); 32 33 ga('create', '
33UA-64534106-1
vendor: 46 bytes, lines 33-35
33', 'auto'); 34 ga('send', 'pageview'); 35
35</script>
35 36 37 38 <!-- Algolia DocSearch --> 39 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css"/> 40 41 <!--STYLES--> 42 <link rel="stylesheet" href="/dist/production.min.bb09ca21.css"> 43 <!--STYLES END--> 44 45 <!-- IE8 style overrides --> 46 <!--[if lt IE 9]> 47 <style> 48 #header .version-nav { display: none!important; } 49 #header .docs-nav i { display: none!important; } 50 #header .nav-container .nav .docs-nav #docs-menu { display: none!important; } 51 #header #unsupported-browser-banner { display: block; } 52 </style> 53 <![endif]--> 54 55 <!-- setup for FB like buttons --> 56
56<script>(function() { 57 var _fbq = window._fbq || (window._fbq = []); 58 if (!_fbq.loaded) { 59 var fbds = document.createElement('script'); 60 fbds.async = true; 61 fbds.src = '//connect.facebook.net/en_US/fbds.js'; 62 var s = document.getElementsByTagName('script')[0]; 63 s.parentNode.insertBefore(fbds, s); 64 _fbq.loaded = true; 65 } 66 _fbq.push(['addPixelId', '600838656713699']); 67 })(); 68 window._fbq = window._fbq || []; 69 window._fbq.push(['track', 'PixelInitialized', {}]); 70 </script>
70 71 <noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?id=600838656713699&ev=PixelInitialized" /></noscript> 72 <!-- /FB Buttons --> 73 74 <!-- for Twitter buttons --> 75
75<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
75 76 <!-- /Twitter buttons --> 77 </head> 78 79 <body ng-app="page" ng-controller="afterRender"> 80 <!-- Header --> 81<div id="header"> 82 83 84 <!--Navigation list--> 85 <div class="nav-container"> 86 <div class="branding"> 87 <a href="/"> 88 <img class="logo" src="/images/logo_sails.png" alt="Sails logo" /> 89 90 </a> 91 92 93 94 <div class="version" is="topbar-version-info" data-current-site-version="1.x"></div> 95 96 </div> 97 98 <div id="nav-menu-overlay"> 99 <div class="veil"></div> 100 </div> 101 102 <div class="documentation-search"> 103 <div class="search-field"> 104 <img class="search-icon" src="/images/icon_search_white.png"/> 105 <input type="text" id="docsearch-query" name="documentation-search" placeholder="Search"/> 106 </div> 107 </div> 108 109 110 111 112 <ul is="nav-menu" class="nav right-nav "> 113 114 115 116 <li class="mobile-only"> 117 <a class="sails-site " 118 href="/">Home</a> 119 </li> 120 121 <li> 122 <a class="sails-site current" 123 href="/get-started">Get started</a> 124 </li> 125 <li> 126 <a class="sails-site " 127 href="/support">Support</a> 128 </li> 129 <li class="mobile-only"> 130 <a class="sails-site " 131 href="/documentation">Documentation</a> 132 </li> 133 <li class="docs-nav no-mobile"> 134 <a is="temporary" class="docs-menu-header docs-menu-wrapper " href="/documentation">Documentation <i class="dropdown-arrow-icon sails-icon icon-angle-down"></i></a> 135 <a is="documentation-dropdown-wrapper" class="docs-menu-wrapper" ></a> 136 </li> 137 138 139 140 </ul> 141 </div> 142 143 <!--Mobile menu button--> 144 145 <div class="menu" is="mobile-menu-button"> 146 <span class="menu-icon"> 147 <i class="sails-icon icon-ellipsis-vertical"></i> 148 </span> 149 </div> 150 151 152 <div id="unsupported-browser-banner"><p><img src="/images/icon_warning.png"/>For a better experience on sailsjs.com, <a target="_blank" href="https://support.microsoft.com/en-us/help/17621/internet-explorer-downloads">update your browser</a>.</p></div> 153</div> 154 155 156<!-- White bar with github updates & social media --> 157<div id="news-banner"> 158 <div class="banner-container"> 159 160 161 <p class="fallback"> 162 <!-- Check out the latest developments in the <a target="_blank" href="https://github.com/balderdashy/sails">GitHub repo</a>. --> 163 Check out the official Sails <a href="https://marketplace.visualstudio.com/items?itemName=Sails.sails-vscode" target="_blank">VS Code extension</a> 164 </p> 165 166 167 <!-- other news can go here.... --> 168 169 <!-- e.g.: --> 170 <!-- <p ng-hide="options.error">Latest update on Github <a target="_blank" href="{{options.latestCommit.url}}">{{options.latestCommit.date | date: 'short'}}</a></p> --> 171 172 <div class="sharing"> 173 <div> 174 <iframe src="//ghbtns.com/github-btn.html?user=balderdashy&repo=sails&type=watch&count=true" 175 allowtransparency="true" frameborder="0" scrolling="0" width="120" height="20"></iframe> 176 </div> 177 178<!-- <div class="facebook-btn"> 179 <iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fsailsjs&width=75&layout=button_count&action=like&show_faces=false&share=false&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:86px; height:21px;" allowTransparency="true"></iframe> 180 </div> --> 181 182 <a href="https://twitter.com/share" class="twitter-share-button" data-text="#sailsjs, the realtime MVC framework for Node.js:" data-url="http://sailsjs.com" data-lang="en">Tweet</a> 183 184 <a href="https://twitter.com/sailsjs" class="twitter-follow-button" data-show-count="false" data-lang="en">Follow @sailsjs</a> 185 </div> <!-- sharing --> 186 </div> 187</div> <!-- white bar --> 188 189 190<div id="sails-page_get-started"> 191 <div class="page-header"> 192 <div class="page-header-container"> 193 <img class="hero-image" alt="A squid wearing a monocle stares at a hellacious tome as it projects a hologram of the Sails.js logo and various celestial bodies" src="/images/get_started_hero.png" data-rjs="2"/> 194 <h1>Ready to set sail?</h1> 195 <h5>Whether youâre new to Node.js, or an Express pro, this part is pretty easy. <br/>Youâll be up and running in no time. </h5> 196 </div> 197 </div> 198 199 <div class="container"> 200 <hr/> 201 202 <div class="get-started-section"> 203 <img class="node" src="/images/get_started_node.png" data-rjs="2"/> 204 <h2 class="section-header">New to Node? No problem.</h2> 205 <p>In order to install Sails, youâll first need to install Node.js. Node is supported on most major operating systems, including MacOS X, Windows, and many flavors of Linux. The website has pre-built installer
205s for plenty of platforms, so you can just hop on over to the downloads section of <a target="_blank" href="https://nodejs.org/en/">nodejs.org</a> and choose the one thatâll work for you.</p> 206 <a target="_blank" href="https://nodejs.org/en/download/" class="link-btn link-btn-primary">Find my node installer</a> 207 </div> 208 209 <hr/> 210 211 <div class="get-started-section"> 212 <img src="/images/get_started_install.png" data-rjs="2"/> 213 <h2 class="section-header">Install Sails</h2> 214 <p>To install Sails:</p> 215 <pre><code class="bash">npm install sails -g</code></pre> 216 <p>This usually takes about 48 seconds. Itâs a good time to grab a cup of coffee or tea. Or if youâre on slow internet, maybe something a bit stronger.</p> 217 <p>If you run into any trouble running NPM, <a href="/support">ask for help.</a></p> 218 </div> 219 220 <div class="get-started-section"> 221 <img src="/images/get_started_create.png" data-rjs="2"/> 222 <h2 class="section-header">Create your app</h2> 223 <p>To generate a new app, just <code>cd</code> into the directory where you want it to be, and type:</p> 224 <pre><code class="bash hljs">sails new test-project</code></pre> 225 <p>You'll see a prompt to choose your project template:</p> 226 <pre><code class="bash hljs">Choose a template for your new Sails app: 227 1. <span style="color: #62A8FF;">Web App</span> · Extensible project with auth, login, & password recovery 228 2. <span style="color: #62A8FF;">Empty</span> · An empty Sails app, yours to configure 229 <span style="opacity: 0.7">(type "?" for help, or <CTRL+> to cancel)</span> 230?</code></pre> 231 <p>Type <code>1</code> (or press enter) to start with our "Web App" template: an opinionated starter project that includes essential features like login, password recovery, emails, and billing. Or, if you want to start from scratch with an empty project, choose <code>2</code> for a classic Sails app.</p> 232 <p>Once you've chosen your template, you'll need to wait a moment for some dependencies to install:</p> 233 <pre><code class="bash"><span style="color: #45EB33;">info:</span> Installing dependencies... 234<span style="opacity: 0.7">Press CTRL+C to cancel.</span> 235<span style="opacity: 0.7">(to skip this step in the future, use --fast)</span> 236<span style="color: #45EB33;">info:</span> Created a new Sails app `test-project`!</code></pre> 237 <p>Then, to take a look at your new Sails app:</p> 238 <pre><code class="bash">cd test-project 239sails lift</code></pre> 240 <p>Now you can go to <a target="_blank" href="http://localhost:1337">localhost:1337</a> to see your brand new homepage.</p> 241 </div> 242 243 <div class="get-started-section"> 244 <img src="/images/get_started_build.png" data-rjs="2"/> 245 <h2 class="section-header">Build something cool</h2> 246 <p>Your project is ready for whatever you want to create. But in case youâre not sure what to do next, here are a few resources that will help get you ready to develop with Sails:</p> 247 <ul> 248 <li><a href="/documentation/anatomy/">Sails app structure</a> - Documentation to get you familiar with common files and folders in your newly-generated app.</li> 249 <li><a target="_blank" href="https://ration.io/">Sails v1 demo app</a> - A live, production app built during our <a target="_blank" href="https://courses.platzi.com/courses/sails-js/">full-stack JavaScript course</a> with Platzi. Source code <a target="_blank" href="https://github.com/mikermcneil/ration">here</a>.</li> 250 <li><a href="/features">What else can Sails do?</a> - Get acquainted with what Sails does out-of-the box, no matter which project template you chose.</li> 251 </ul> 252 <a target="_blank" href="https://courses.platzi.com/courses/sails-js/" class="link-btn link-btn-primary">Enroll in the course</a> 253 <a href="/whats-that" class="link-btn link-btn-secondary">Learn about your new app<i class="sails-icon icon-arrow-circle-right"></i></a> 254 </div> 255 </div> 256</div> 257 258<!-- Footer --> 259<div id="footer" class="invisible" data-hide-until-rendered> 260 <div class="navigation-footer "> 261 <div class="row"> 262 <img class="sails-logo small-screen" src="/images/logo_sails.png"> 263 <div class="column left-column top"> 264 <h4>Built with Love</h4> 265 <p>The Sails framework is built by a <a href="/about">web & mobile shop in Austin, TX</a>, with the help of our contributors. We created Sails in 2012 to assist us on Node.js projects. Naturally we open-sourced it. We hope it makes your life a little bit easier!</p> 266 </div> 267 <div class="column right-column top"> 268 <div class="nav-list left-nav-list"> 269 <h5>Sails<span class="divider">:</span></h5> 270 <ul> 271 <li> 272 <a href="/whats-that">What is Sails?</a> 273 </li> 274 <li> 275 <a href="/support">Community</a> 276 </li> 277 <li> 278 <a target="_blank" href="https://twitter.com/sailsjs">News</a> 279 </li> 280 <li> 281 <a href="/contact">For business</a> 282 </li> 283 </ul> 284 </div> 285 <div class="nav-list middle-nav-list"> 286 <h5>About<span class="divider">:</span></h5> 287 <ul> 288 <li> 289 <a href="/about">Our company</a> 290 </li> 291 <li> 292 <a href="/security">Security</a> 293 </li> 294 <li> 295 <a href="/legal">Legal</a> 296 </li> 297 <li> 298 <a href="/resources">Logos/artwork</a> 299 </li> 300 </ul> 301 </div> 302 <div class="nav-list right-nav-list"> 303 <h5>Help<span class="divider">:</span></h5> 304 <ul> 305 <li> 306 <a href="/get-started">Get started</a> 307 </li> 308 <li class="wide-screen"> 309 <a href="/documentation">Documentation</a> 310 </li> 311 <li class="small-screen"> 312 <a href="/documentation">Docs</a> 313 </li> 314 <li class="wide-screen"> 315 <a href="/documentation/contributing">
315Contribute</a> 316 </li> 317 <li> 318 <a target="_blank" href="https://courses.platzi.com/courses/sails-js/">Take a class</a> 319 </li> 320 </ul> 321 </div> 322 </div> 323 </div> 324 <div class="row"> 325 <div class="column left-column"> 326 <img class="sails-logo wide-screen" src="/images/logo_sails.png"> 327 <p class="license-info"><a href="/about">© 2012-2026 The Sails Company</a>. 328 <br/> 329 The Sails framework is free and open-source under the MIT License. 330 <br/> 331 Illustrations by <a target="_blank" href="https://www.edamamedesign.com">Edamame</a>. 332 </p> 333 </div> 334 <div class="column right-column bottom"> 335 <div class="social-icons"> 336 <a target="_blank" href="https://twitter.com/sailsjs"> 337 <i class="sails-icon icon-social-twitter"></i> 338 </a> 339 <a target="_blank" href="https://www.facebook.com/sailsjs"> 340 <i class="sails-icon icon-social-facebook"></i> 341 </a> 342 <a target="_blank" href="https://github.com/balderdashy/sails"> 343 <i class="sails-icon icon-social-github"></i> 344 </a> 345 <a target="_blank" href="https://www.pinterest.com/sailsjs/"> 346 <i class="sails-icon icon-social-pinterest"></i> 347 </a> 348 <a target="_blank" href="http://stackoverflow.com/search?q=sails"> 349 <i class="sails-icon icon-social-stackoverflow"></i> 350 </a> 351 </div> 352 </div> 353 </div> 354 </div> 355</div> 356 357 358 359 360 361 <!-- 362 Client-side Templates 363 ======================== 364 365 HTML templates are important prerequisites of modern, rich client applications. 366 To work their magic, frameworks like React, Vue.js, Angular, Ember, and Backbone 367 require that you load these templates client-side. 368 369 By default, your Gruntfile is configured to automatically load and precompile 370 client-side JST templates in your `assets/templates` folder, then 371 include them here automatically (between TEMPLATES and TEMPLATES END). 372 373 To customize this behavior to fit your needs, just edit `tasks/pipeline.js`. 374 For example, here are a few things you could do: 375 376 + Import templates from other directories 377 + Use a different view engine (handlebars, dust, pug/jade, etc.) 378 + Internationalize your client-side templates using a server-side 379 stringfile before they're served. 380 --> 381 382 <!--TEMPLATES--> 383 384 <!--TEMPLATES END--> 385 386 387 <!-- 388 Server-side View Locals 389 ======================== 390 391 Sometimes, it's convenient to get access to your server-side view locals from 392 client-side JavaScript. This can improve page load times, remove the need for 393 extra AJAX requests, and make your client-side code easier to understand and 394 to maintain. Sails provides a simple mechanism for accessing dynamic view 395 locals: the "exposeLocalsToBrowser()" view partial. 396 397 For more information on using this built-in feature, see: 398 https://sailsjs.com/docs/concepts/views/locals#?escaping-untrusted-data-using-exposelocalstobrowser 399 400 --> 401 402 403 <!-- 404 405 Client-side Javascript 406 ======================== 407 408 You can always bring in JS files manually with `script` tags, or asynchronously 409 on the client using a solution like AMD (RequireJS). Or, if you like, you can 410 take advantage of Sails' conventional asset pipeline (boilerplate Gruntfile). 411 412 By default, files in your `assets/js` folder are included here 413 automatically (between SCRIPTS and SCRIPTS END). Both JavaScript (.js) and 414 CoffeeScript (.coffee) are supported. In production, your scripts will be minified 415 and concatenated into a single file. 416 417 To customize any part of the built-in behavior, just edit `tasks/pipeline.js`. 418 For example, here are a few things you could do: 419 420 + Change the order of your scripts 421 + Import scripts from other directories 422 + Use a different preprocessor, like TypeScript 423 424 --> 425 426 <!--SCRIPTS--> 427
427<script src="/dist/production.min.5e91d4d8.js"></script>
427 428 <!--SCRIPTS END--> 429 430 <!-- Algolia DocSearch --> 431
431<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
431 432 433
433<script type="text/javascript"> 434 // Initialize an angular module. 435 angular.module('page', ['sails']); 436 // Initialize the ctrl. 437 angular.module('page').controller('afterRender', ['sailsWebsiteActions', function (sailsWebsiteActions){ 438 // Wait for one tick of the digest loop before calling on our afterRender handlers, 439 // to avoid angular trying to reference elements that don't exist and causing a 440 // "Cannot read property 'childNodes' of undefined" error. 441 // For more information, see: 442 // https://www.bennadel.com/blog/2892-typeerror-cannot-read-property-childnodes-of-undefined-in-angularjs.htm 443 setTimeout(function afterATick() { 444 // Now call upon the proper handler for the current page's events. 445 sailsWebsiteActions({ 446 page: 'get-started' 447 }); 448 }); 449 450 }]); 451 </script>
451 452 453
453<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"28e9163da9ba46ae968325662fce5374","r":1,"spa":2}' crossorigin="anonymous"></script>
453 454</body> 455</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.