zoukankan      html  css  js  c++  java
  • 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




  • 相关阅读:
    MIne FirstBlog
    P6563 [SBCOI2020]一直在你身旁
    P6563 [SBCOI2020]一直在你身旁
    T122085 [SBCOI2020]时光的流逝
    LC 918. Maximum Sum Circular Subarray
    1026 Table Tennis
    LC 1442. Count Triplets That Can Form Two Arrays of Equal XOR
    LC 1316. Distinct Echo Substrings
    LC 493. Reverse Pairs
    1029 Median (二分)
  • 原文地址:https://www.cnblogs.com/mqxnongmin/p/10485572.html
Copyright © 2011-2022 走看看