• NLifeBill第一章项目搭建


    NLifeBill这个项目是我自己独立开发的一个项目,之前这个项目叫LifeBill(生活账单),项目地址是:https://github.com/Dn9x/LifeBill这个项目是去年开始去年就已经开始使用了,主要是记录我家里的每天生活消费的费用,用了几个月之后发现最初的分类不完整,而且也想添加一些功能和晚上报表功能,就想着重构,之前的LifeBill是用Asp.net MVC3开发的,从2012年就一直喜欢nodejs所以这次重构的时候就想着全部用nodejs吧,所以名字我就添加了一个N在前面。

    NLifeBill这个项目的相关文章主要记录下我的开发过程,一方面提升下写博客的能力,比较从自己的博客关闭之后就很少写了,一方面以后还可以回头看看。整个项目的地址:https://github.com/Dn9x/NLifeBill,我基本上是每天提交一次,周末的时候我可能会有事就没有提交。

    阅读目录:

      1.环境介绍
      2.项目搭建
      3.前端介绍
         4.数据库介绍
      5.项目提交

    环境介绍

    开发环境:Win7

    数据库:MySQL5.5

    语言平台:NodeJS

    开发框架:Express

    项目搭建

    项目是使用nodejs开发,不该这么说,因为nodejs是平台,不是语言。框架使用的是Express,这个框架是MVC框架,在Nodejs中特别的火,刚好我也算有点了解所以就使用这个。

    Express安装使用还是很简单的,nodejs安装好之后,直接在命令行执行:

    1 npm install -g express

    npm是nodejs的包管理器,现有的版本在安装nodejs就会自动安装了,-g表示全局安装express,这也是为了使用方便。

    在你的需要创建项目的盘符下使用命令:

     1 E:StudySpaceGitHub>express -e NLifeBill
     2 
     3    create : NLifeBill
     4    create : NLifeBill/package.json
     5    create : NLifeBill/app.js
     6    create : NLifeBill/public
     7    create : NLifeBill/public/javascripts
     8    create : NLifeBill/public/images
     9    create : NLifeBill/public/stylesheets
    10    create : NLifeBill/public/stylesheets/style.css
    11    create : NLifeBill/routes
    12    create : NLifeBill/routes/index.js
    13    create : NLifeBill/routes/user.js
    14    create : NLifeBill/views
    15    create : NLifeBill/views/index.ejs
    16 
    17    install dependencies:
    18      $ cd NLifeBill&& npm install
    19 
    20    run the app:
    21      $ node app

    上面的-e表示是模板引擎使用的是ejs。在命令行下 进入NLifeBill下面输入npm install,上面的命令行第18行就已经说明了,就会自动安装所需要的库。这里我提前修改了我的package.json,这个文件记录项目信息和所需要的相关的库:

    {
      "name": "nlifebill",
      "description": "my life bill",
      "version": "0.0.2",
      "author": {
        "name": "Dn9x",
        "email": "xiuxu123@live.cn"
      },
      "private": true,
      "scripts": {
        "start": "node app.js"
      },
      "dependencies": {
        "express": "3.4.8",
        "ejs": "*",
        "connect-flash": "*",
        "mysql": "2.0.1",
        "redis": "0.10.0"
      }
    }

    npm install之后就可以直接运行项目了,node app就可以了。项目默认会在3000端口启动。

    前端介绍

    因为这次我的前端的数据处理我没有打算使用ejs作为模板引擎,应该说也用了,但是前端主要使用的是angularjs,所以这次在记录这个项目的时候我也会同时记录有关angularjs的使用心得,我会放在另外的文章里面介绍。既然要是angularjs,那么项目就要调整下。

    把所有的视图文件的后缀都改成.html,因为默认是使用ejs模板,那么后缀默认的都是.ejs。修改方式是修改项目下的app.js文件,修改如下:

    1 --之前是这样的一句代码
    2 app.set('view engine', 'ejs');
    3 
    4 --把上面这句代码替换成这样:
    5 app.set('view engine', 'html');
    6 app.engine('.html', require('ejs').__express);

    这里要提下,新的express在修改了模板后缀之后,引入视图文件就要加后缀了,我用的express是3.4.8,至少这个版本的要加,比如:

    1 //我的index视图文件要引入header.html文件
    2 <%- include header.html %>

    这里我使用angualrjs版本是1.2.13,之前使用的是1.0.7的,后来切换到最新版本还出了点问题,这里建议使用最新的,功能也新增了很多。

    至于UI方面我使用的是Bootstrap3.0.3。以前的时候都是使用国产的渴切。后来发现都差不多,所以也尝试下bootstrap。

    数据库介绍

    数据库我使用的是mysql5.5,总共就四张表,

    master主档表,
    detail明细档表,
    user用户表,
    tags分类表

    因为整个系统是自己家里人使用的,所以并没有什么权限控制,之所以后面会提到权限只是为了管控没有登录的用户的。没其他的意思。

    项目提交

    项目我都提交到github上了,首先在github上面新建项目:NLifeBill,创建完之后就都是本地的事情了。

    在命令行下进入到你的项目文件夹下:

    1 git init

    初始化项目。

    1 git add *

    *表示所有的文件,一般可以不提交node_modules文件夹下的文件,但是我公司里面无法使用npm,所以我都提交了。

    git commit -m "first commit"

    添加备注,是提交的备注。说明下这次提交了什么信息。

    git remote add origin https://github.com/Dn9x/NLifeBill

    把项目要推送的远程地址设置好,第一次推送要这个命令,后面修改过之后就不用这条命令了,

    git push -u origin master

    把项目推送到远程服务器上,master是项目的主分支,也是主干,如果你想推送到其他分支上面,直接把master改成你分支的名称就行了,接下来会让你输入账号和密码的。

    如果你在github上面创建新的仓库的时候并且没有新建readme.md文件,那么github会提示你怎么使用git提交项目的。

    补充:这次的项目我没有按照以前的方式开发,而是把登录页面做好之后就没有做登录和权限控制了,而是直接开始做功能的部分了,我是打算功能的部分做好之后再回头晚上登录和权限控制的,然后再完善功能上的不足,所以你们会看到我很多地方代码只是写了一部分确没有实际使用。

  • 相关阅读:
    C语身教程第七章:结构与勾结(3)
    C言语教程第八章:枚举,位运算(4)
    C说话教程第七章:机关与连合(1)
    C语身教程第七章:结构与连系(8)
    C语身教程第七章:布局与勾结(2)
    C言语教程第十章:文件(1)
    C语身教程第八章:列举,位运算(3)
    C言语教程第七章:机关与团结(6)
    C语身教程第六章:指针(7)
    C言语教程第七章:构造与联合(4)
  • 原文地址:https://www.cnblogs.com/Dn9x/p/3564167.html
Copyright © 2020-2023  润新知