搭建你自己的网站--LAMP架构(Ubuntu 16.04)--

2016-12-02 本文已影响1215人张照博

开篇语

笔者目前算是一个WEB方向的踽踽前行的小菜鸟，但是也是现在手上有两台云服务器在手的人了，网站也做了两个了，所以，今天接着昨天的话题，我们来搭建一个自己网站，这样，我先把我以前搭建的一个给大家看看，

我给自己团队做的网站--武汉迅睿尔
另外，网址奉上武汉迅睿尔

First Step --熟悉linux并且安装Apache2

Install Apache2 on Ubuntu 16.04

在 ubuntu16.04 的系统上装载 LAMP网站服务架构的骨架Apache2

LAMP（Linux，Apache，MySQL，PHP）是一种用于托管Web内容常见的网络协议栈。本指南介绍了如何安装和测试在Ubuntu 16.04 LAMP架构（LTS）。
最好是用root 账户进行操作可以省心不少

首先更新你的系统：

sudo apt-get update && sudo apt-get upgrade

然后安装Apache2


sudo apt-get install apache2

然后编辑下列文档：

File: /etc/apache2/apache2.conf

修改下述内容：

KeepAlive Off

然后修改下面路径的内容

File: /etc/apache2/mods-available/mpm_prefork.conf

<IfModule mpm_prefork_module>
StartServers               4 
MinSpareServers           20
MaxSpareServers            40 
MaxRequestWorkers          200
MaxConnectionsPerChild       4500
</IfModule>

输入以下命令载入上述修改：

sudo a2dismod mpm_event
sudo a2enmod mpm_prefork

然后退出修改并执行下列命令：（重启Apache2）

sudo systemctl restart apache2

恭喜你，你已经打开了WEB的大门，现在，找个浏览器，在地址栏输入你的服务器的IP，你就可以看到你的第一个网页了。这个是Apache2赠送的吧，哈哈

地址栏和第一个网页

Second Step -- 安装Mysql数据管理器

install Mysql on Ubuntu

sudo apt-get install mysql-server

在安装过程中会要你两次输入root账户（mysql的root 不是linux的）的密码。一定要记住，不然你就对你的mysql失去了操作权

mysql -u root -p

然后登陆进去

mysql界面

输入如下指令创建你的第一个数据库：（建议直接照抄，之后删除即可，测试期间不要太在意）：

CREATE DATABASE webdata; 
GRANT ALL ON webdata.* TO 'webuser' IDENTIFIED BY 'password';

退出mysql输入如下指令即可：

mysql >  quit

Third Step -- 安装PHP7.0之交互的桥梁

php是连接mysql与apache2的桥梁，通过读取mysql中的内容然后反馈给apache2 然后在网页上显示出来，这就形成了响应机制，用户通过对网页的操作，告诉apache2自己想要的操作，然后apache2 找上了php ，php就去mysql那里拿数据，然后老老实实的把数据打包一下发给apache告诉浏览器这个用户想干嘛，然后apache2就把这些数据返回给用户，这么一解释，是不是好理解多了？

安装代码如下：

sudo apt-get install php7.0 php-pear libapache2-mod-php7.0 php7.0-mysql

当然，你如果想要实现更多功能，不妨把以下东西都给装了，这个是可以选的：

sudo apt-get install php7.0-curl php7.0-json php7.0-cgi

编辑文件

File : /etc/php/7.0/apache2/php.ini

max_input_time = 30
error_reporting = E_COMPILE_ERROR | E_RECOVERABLE_ERROR | E_ERROR | E_CORE_ERROR
error_log = /var/log/php/error.log(这个我没找到，所以自己在下面写了一个就好了)

然后创建几个文件：

sudo mkdir /var/log/php 
sudo chown www-data /var/log/php

下一步，重启Apahce2，载入我们所做的操作：

sudo systemctl restart apache2

当然，如果你要验证一下你的操作是否都成功了，可以有这么一些手段：
在服务器端的文件下编辑：

File excerpt: /var/www/html/text.php

(这个text.php是你自己建立的，不是自带的，自带的只有一个index.html)
至于一些怎么编辑，这个，太基础了。我估计这要都不会，很难成功，所以还是先去恶补一下linux--ubuntu的操作吧

<html>
<head> 
<title>PHP Test</title>
</head>
 <body>
 <?php echo '<p>Hello World</p>'; 
// In the variables section below, replace user and password with your own MySQL credentials as created on your server   下面的那些变量你要根据你自己的情况修改，username是你的数据库用户名，password是这个用户名的密码，

$servername = "localhost";
 $username = "webuser"; 
$password = "password"; 
// Create MySQL connection  
$conn = mysqli_connect($servername, $username, $password);
 // Check connection - if it fails, output will include the error message
if (!$conn)
 {
 die('<p>Connection failed: <p>'.mysqli_connect_error()); 
} 
echo '<p>Connected successfully</p>'; ?>
</body>
</html>

在你的浏览器输入这个文件的地址，也就是你的服务器IP+text.php，图片上的是我自己命名的，你随意～～～～

成功了的标志

结束语

OK啦。LAMP就已经搭建完成了，L（Linux）A（Apache2）M（Mysql）P（PHP）剩下的就是更深入的一些内容了。HTML5编辑啊。还有一些CSS3 样式编辑啊，Javascript的设计啊。Mysql数据库的编辑啊。PHP文件的编写啊，业务逻辑设计，算法设计啊，太多了不一而足～～～～～
下面我还是放几个我常用的代码到这儿吧，另外还附上效果图哦。

别踩白块网页版！！
～～～～～～～～～～～～～～～～～～·网址奉上～～～～～～～～～～～～～～～～～～

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
    <title>别踩白块儿</title>
    <style>
    *{margin:0;padding:0;list-style-type:none;}
    a,img{border:0;}
    html,body{ width: 100%;height:98%; }
    body{font:12px/180% Arial, Helvetica, sans-serif, "微软雅黑";}

    .main{position:relative;margin:10px auto;max-width:380px;height:600px;border:1px solid #ccc;overflow:hidden;}
    .ph-main{width: 100%;height: 100%;position: relative;border: none; margin: auto;overflow: hidden;}
    .container{position:absolute;top:-150px;width:100%;height:auto;}
    .row{width:100%;height:150px;}
    .cell{float:left;width:25%;height:100%;background-color: #912CEE;}
    .block{background:#76EE00;cursor:pointer;}  .mark{ position: absolute; width: 40px; height: 20px; background-color: #e8e8e8;
        border-radius: 50%; top: 10px; left: 50%; margin-left: -20px; text-align: center; line-height: 20px;z-index: 1;}
    .mask , .again-mask{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.3);text-align: center;z-index: 2;}
    .mask h1 , .again-mask h1{ color: #fff;height: 50px;line-height: 50px;font-family: '微软雅黑';margin-top: 35%; }
    .mask span , .again-mask span{ display: block; width: 100px;height: 50px;font-size: 20px; text-align: center; line-height: 50px;margin: 50px auto; background: #4cd964;color: #fff;border-radius: 6px; cursor: pointer; -webkit-box-shadow: 1px 1px 1px #999;box-shadow: 1px 1px 1px #999;text-shadow: 1px 1px 1px #fff; }
    .again-mask h2{ color: #fff;height: 45px;line-height: 45px;font-family: '微软雅黑';}
    </style>
</head>
<body>
    <div class="main" id="main">
        <div class="container" id="container">
        </div>
        <div class="mask" id="mask">
            <h1>别踩白块儿</h1>
            <span id="start">开始</span>
        </div>
    </div>

    <script src="js/Block.js"></script>
    <script>
        var oContainer = document.getElementById('container');
        var block = new Block(oContainer);
        block.init();

        var mask = document.getElementById('mask');
        var start = document.getElementById('start');
        start.onclick = function(){
            block.start();
            mask.style.display = 'none';
        }
    </script>
    <div style="text-align:center;">
<h3>来源:<a href="http://www.mycodes.net/" target="_blank">张照博制作</a></h3>
</div>
</body>
</html>

别的都不说了，大家伙好好学习啊！！！有空多交流

个人宣言：

知识传递力量，技术无国界，传播文化改变你我生活!