版权声明：本文为博主原创文章，未经博主同意不得转载。 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

socket.io+angular.js+express.js做个聊天应用(三)的更多相关文章

  1. soket.io.js + angular.js + express.js(node.js)

    soket.io.js + angular.js + express.js(node.js) 今天搭建个soket.io.js + angular.js + express.js的环境, 采坑无数,特 ...

  2. Angular JS + Express JS入门搭建网站

    3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术.于是周末顺便学习下新技术. 组里产品UI架构如下: 其中前端,主要使用Angular JS框架,另外 ...

  3. socket.io+angular.js+express.js做个聊天应用(四)

    接着上一篇 使用angularjs构建聊天室的client <!doctype html> <html ng-app="justChatting"> < ...

  4. socket.io+angular.js+express.js做个聊天应用(二)

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/www19940501a/article/details/27585321 接着上一篇 我用的开发工具 ...

  5. 使用React、Node.js、MongoDB、Socket.IO开发一个角色投票应用的学习过程（三）

    这几篇都是我原来首发在 segmentfault 上的地址:https://segmentfault.com/a/1190000005040834 突然想起来我这个博客冷落了好多年了,也该更新一下,呵 ...

  6. 【socket.io研究】3.手机网页间聊天核心问题

    前面我们已经说了服务器相关的一些内容,且又根据官网给出的一个例子写了一个可以聊天的小程序,但是这还远远不够呀,这只能算是应用前的准备工作.接下来,一起来考虑完善一个小的聊天程序吧. 首先,修改服务器的 ...

  7. Vue3 + Socket.io + Knex + TypeScript 实现可以私聊的聊天室

    前言 下文只在介绍实现的核心代码,没有涉及到具体的实现细节,如果感兴趣可以往下看,在文章最后贴上了仓库地址.项目采用前后端模式,前端使用 Vite + Vue3 + TS:后端使用 Knex + Ex ...

  8. socket.io+angular.js+express.js做个聊天应用(一)

    node,express开发环境等安装如果已经搞好了. justhacker@justhacker-ThinkPad-Edge-E440:~/projects/nodejs$ express -e c ...

  9. 基于 Sequelize.js + Express.js 开发一套 Web 后端服务器

    什么是 Sequelize 我们知道 Web 应用开发中的 Web 后端开发一般都是 Java.Python.ASP.NET 等语言.十年前,Node.js 的出现使得原本仅限于运行在浏览器中的 Ja ...

随机推荐

  1. IP白名单添加了当前IP，获取access_token时依然报出错误码40164的坑

    开发公众号网页时,想要调用微信API接口,令人无奈的是,想要调用各接口都需使用access_token,于是,获取access_token的征途开始了…… 1.开发者基本配置 (1) 公众平台官网登录 ...

  2. python字典操作和内置方法

    一 字典基本介绍 python中只有字典是映射结构,通过key取值,并且key是不可变数据类型,而value可以是任意数据类型. 字典通过一个花括号,里面存放key:value的数据结构来定义.理论上 ...

  3. VirtualBox安装CentOS7

    一:.下载CentOS7的镜像 下载地址:https://www.centos.org/download/ 进入后有三个版本可以选择: 1.DVD ISO  标准安装版,一般下载这个就可以了(推荐)本 ...

  4. java的四个基本特征

    现实生活中的事物被抽象成对象,把具有相同属性和行为的对象被抽象成类,再从具有相同属性和行为的类中抽象出父类. 封装 隐藏对象的属性和实现细节,仅仅对外公开接口. 封装的有优点: 1.便于使用者正确.方 ...

  5. JS 上传图片 + 预览功能（二）

    简单粗暴 直接进入主题: Html <script src="../js/jquery-2.1.1.min.js"></script> <style& ...

  6. 【github&&git】4、git常用命令（持续更新中）

    git常用命令(持续更新中) 本地仓库操作git int                                 初始化本地仓库git add .                       ...

  7. 微信服务器配置令牌(Token)

    实现步骤: 第一步:填写服务器配置 登录微信公众平台官网后,在公众平台后台管理页面 - 开发者中心页,点击“修改配置”按钮,填写服务器地址(URL).Token和EncodingAESKey,其中UR ...

  8. 【读书笔记】iOS-Settings Bundle

    一,打开工程--->右键--->Add File--->iOS-->Resource-->Settings Bundle. 二,会弹出如下对话框---->Creat ...

  9. 网络基础 http 会话(session)详解

    http 会话(session)详解 by:授客 QQ:1033553122 会话(session)是一种持久网络协议,在用户(或用户代理)端和服务器端之间创建关联,从而起到交换数据包的作用机制 一. ...

  10. 安卓开发_数据存储技术_sqlite

    一.SQLite SQLite第一个Alpha版本诞生于2000年5月,它是一款轻量级数据库,它的设计目标是嵌入式的,占用资源非常的低,只需要几百K的内存就够了.SQLite已经被多种软件和产品使用 ...