• socket.io+angular.js+express.js做个聊天应用(三)


    版权声明:本文为博主原创文章,未经博主同意不得转载。 https://blog.csdn.net/www19940501a/article/details/27590611


    接着前面博客文章socket.io+angular.js+express.js做个聊天应用(二)


    首先开发之前先介绍下bower。它是用来管理前端类库的(详细介绍,安装可看http://blog.csdn.net/edagarli/article/details/26359535


    justhacker@justhacker-ThinkPad-Edge-E440:~/projects/nodejs/chattingnode$ bower
    
    Usage:
    
        bower <command> [<args>] [<options>]
    
    Commands:
    
        cache                   Manage bower cache
        help                    Display help information about Bower
        home                    Opens a package homepage into your favorite browser
        info                    Info of a particular package
        init                    Interactively create a bower.json file
        install                 Install a package locally
        link                    Symlink a package folder
        list                    List local packages
        lookup                  Look up a package URL by name
        prune                   Removes local extraneous packages
        register                Register a package
        search                  Search for a package by name
        update                  Update a local package
        uninstall               Remove a local package
        version                 Bump a package version
    
    Options:
    
        -f, --force             Makes various commands more forceful
        -j, --json              Output consumable JSON
        -l, --log-level         What level of logs to report
        -o, --offline           Do not hit the network
        -q, --quiet             Only output important information
        -s, --silent            Do not output anything, besides errors
        -V, --verbose           Makes output more verbose
        --allow-root            Allows running commands as root
    
    See 'bower help <command>' for more information on a specific command.


    说明bower成功安装!


    使用bower来安装bootstrap和angularjs


    justhacker@justhacker-ThinkPad-Edge-E440:~/projects/nodejs/chattingnode$ bower install bootstrap angular --save
    bower not-cached    git://github.com/twbs/bootstrap.git#*
    bower resolve       git://github.com/twbs/bootstrap.git#*
    bower not-cached    git://github.com/angular/bower-angular.git#*
    bower resolve       git://github.com/angular/bower-angular.git#*
    bower download      https://github.com/angular/bower-angular/archive/v1.2.16.tar.gz
    bower download      https://github.com/twbs/bootstrap/archive/v3.1.1.tar.gz
    bower extract       angular#* archive.tar.gz
    bower resolved      git://github.com/angular/bower-angular.git#1.2.16
    bower extract       bootstrap#* archive.tar.gz
    bower resolved      git://github.com/twbs/bootstrap.git#3.1.1
    bower cached        git://github.com/jquery/jquery.git#2.1.1
    bower validate      2.1.1 against git://github.com/jquery/jquery.git#>= 1.9.0
    bower install       angular#1.2.16
    bower install       bootstrap#3.1.1
    bower install       jquery#2.1.1
    bower no-json       No bower.json file to save to, use bower init to create one
    
    angular#1.2.16 bower_components/angular
    
    bootstrap#3.1.1 bower_components/bootstrap
    └── jquery#2.1.1
    
    jquery#2.1.1 bower_components/jquery
    


    加入类库到index.ejs中

    <!DOCTYPE html>
    <html>
      <head>
      	<meta charset="UTF-8">
        <title><%= title %></title>
        <link rel='stylesheet' href='/stylesheets/style.css' />
        <link rel='stylesheet' href='/components/bootstrap/dist/css/bootstrap.css' />
        <script type="text/javascript" src="/socket.io/socket.io.js"></script>
        <script type="text/javascript" src="/components/jquery/jquery.js"></script>
        <script type="text/javascript" src="/components/bootstrap/dist/js/bootstrap.js"></script>
        <script type="text/javascript" src="/components/angular/angular.js"></script>
      </head>
      <body>
      	<script type="text/javascript">
           var socket=io.connect('/');
           socket.on('connected',function(){
             alert('connected to chattingRoom!');
           });
      	</script>
        <h1><%= title %></h1>
        <p>Welcome to <%= title %></p>
      </body>
    </html>
    



    项目源代码地址:https://github.com/edagarli/chattingnode




  • 相关阅读:
    2015年值得关注的8款跨平台开发工具(界面类)
    2015年最值得关注的8款用户界面新品
    2015年最受欢迎的8个用户界面组件
    DevExpress v15.2.4帮助文档下载(全)
    DevExpress .NET界面开发示例大全
    DevExpress免费线上公开课17日开课
    DevExpress 2015.2发布 看看有哪些更新
    图文详细解说DevExpress 2015新版亮点【附文档下载】
    myeclipse 2015 CI 16发布【附下载】
    swift 第三天 控制流
  • 原文地址:https://www.cnblogs.com/mqxnongmin/p/10485572.html
Copyright © 2020-2023  润新知