• ArthurSlog
  • SLog-62
  • Year·1
  • Guangzhou·China
  • September 9th 2018

ArthurSlog个人网站上线了～

开发环境MacOS(High Sierra 10.13.5)

需要的信息和信息源：

开始编码

  • 继之前的域名购买、服务器购买、域名解析、域名备案完成之后，现在把第一版的网站正式上线
  • 网站地址 www.arthurslog.com
  • 第一版网站，以最少的代码实现：
  1. 网站标题是“个人技术分享”
  2. 背景图一张
  3. 底部根据管局要求，附上了备案号并链接至管局
  4. 前端布局使用到了 calc方法
  5. 后端使用 koa框架 + koa-static 实现了一个简单的web服务器
  • 前后端所有代码已经上传至 v1.0.0Github
  • 当前的文件结构：

ArthurSlog

|

|

 -- index.html

 -- index.js

 -- style.css

 -- background.jpg

 -- node_modules

 -- package.json

 -- package-lock.json

 --README.md
  • 当前的前端代码index.html、style.css如下：

index.html

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>ArthurSlog</title>

        <link rel="stylesheet" type="text/css" href="style.css" >

    </head>

    <body>

        <p>个人技术分享</p>

        <footer>

            <a href="http://www.miitbeian.gov.cn">粤ICP备18088522号-1</a>

        </footer>

    </body>

</html>

style.css

body{

    background-image:url('background.jpg');

    background-repeat:no-repeat;

    background-position:50% -10%;

}

p{

    font-size: 48px;

    position: relative;

    left: calc(50% - 144px);

}

footer {

    font-size: .8rem;

    position: absolute;

    bottom: 10px;

    left: calc(50% - 80px);

}
  • 后端服务器代码index.js如下：

index.js

const serve = require('koa-static');

const Koa = require('koa');

const app = new Koa();

// $ GET /package.json

app.use(serve('.'));

app.listen(80);

console.log('listening on port 80');
  • 配置文件 package.json如下：

package.json

{

  "name": "nodeserver",

  "version": "1.0.0",

  "description": "",

  "main": "index.js",

  "dependencies": {

    "koa": "^2.5.2",

    "koa-static": "^5.0.0"

  },

  "devDependencies": {},

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1"

  },

  "repository": {

    "type": "git",

    "url": "git+https://github.com/BlessedChild/ArthurSlog.com.git"

  },

  "author": "",

  "license": "ISC",

  "bugs": {

    "url": "https://github.com/BlessedChild/ArthurSlog.com/issues"

  },

  "homepage": "https://github.com/BlessedChild/ArthurSlog.com#readme"

}
  • 自述文件 README.md如下：

README.md

# This is ArthurSlog.com
  • 另外，其他的文件无需手动修改，不管
  • 至此，完成了第一版网站源码的编写。

欢迎关注我的微信公众号 ArthurSlog

如果你喜欢我的文章 欢迎点赞 留言

谢谢

Slog62_项目上线之ArthurSlog个人网站上线1的更多相关文章

  1. Slog64_项目上线之ArthurSlog个人网站上线3

    ArthurSlog SLog-64 Year·1 Guangzhou·China September 9th 2018 ArthurSlog Page GitHub NPM Package Page ...

  2. Python3 + django2.0 + apache2 + ubuntu14部署网站上线

    自己尝试在本地搭建了 Django 项目后,想部署到自己云服务器上,经常多次尝试和多次踩坑(捂脸),总结如下: 环境:ubuntu14, django2.0, apache2. 1.首先安装需要的库包 ...

  3. http://182.92.241.20/mypro/login 偶的点金项目细化分包管理平台即将上线！！

    http://182.92.241.20/mypro/login            偶的点金项目细化分包管理平台即将上线!! 敬请期待! 项目外包利器 项目管理利器

  4. 喜大普奔，SITE4J网站上线啦

    喜大普奔,SITE4J网站上线啦: 你懂的:https://peterchenhdu.club/

  5. thinkphp5项目--练手--企业单车网站（九）（友情链接）

    thinkphp5项目--练手--企业单车网站(九)(友情链接) 项目地址 fry404006308/BicycleEnterpriseWebsite: Bicycle Enterprise Webs ...

  6. 项目：git+gitlab+jenkins+ansible上线网站

    项目需求 1. 在gitlab中创建一个项目 nginxinstall2. 编写playbook,实现一键部署nginx.部署一个静态测试页.测试部署结果要求: 部署nginx 端口:83 运行身份: ...

  7. 基于SSM实现的简易员工管理系统（网站上线篇）

    经历无数苦难,好不容易,网站终于上线了.=.=内牛满面ing.chengmingwei.top就是本员工管理系统的主页啦.是的,很简陋,但是毕竟是第一次嘛,所以慢慢来嘛. 如上次所说的(网站简介,见: ...

  8. ECS centos6.8系统下从nginx安装到简单网站上线配置操作的完整记录

    1.准备工作 1.1已购买阿里云云服务器ECS 1.2域名已购买并解析成功 1.3安装有远程链接工具Xshell和文件传输工具Xftf,并链接上ECS实例 2.安装nginx(在Xshell操作) 2 ...

  9. 热烈祝贺达孚电子（NDF）网站上线

    尊敬的客户: 您们好! 为适应公司发展的需要,树立公司的良好形象,满足大家更多的了解电容器系列产品及公司的服务,经过1个多月的筹备,在2019年10月21日公司网站正式上线啦,这标志着NDF(达孚电子 ...

随机推荐

  1. 2018 ACM-ICPC 宁夏 H.Fight Against Monsters（贪心）

    It is my great honour to introduce myself to you here. My name is Aloysius Benjy Cobweb Dartagnan Eg ...

  2. Qt 信息提示框 QMessageBox

    information QMessageBox::information(NULL, "Title","Content",QMessageBox::Yes | ...

  3. Memcache工作原理

    1       Memcache是什么 Memcache是danga.com的一个项目,最早是为 LiveJournal 服务的,目前全世界不少人使用这个缓存项目来构建自己大负载的网站,来分担数据库的 ...

  4. IPC之——消息队列

    消息队列作用: 可以用于两个没有联系的进程间通信,创建一个消息队列类似于打开了一个文件,两个不同的进程都可以进行操作 消息队列之函数介绍: 头文件:<sys/type.h> <sys ...

  5. Session深入浅出

    Session会在浏览器关闭后消失吗? 通常情况下,当我们关闭浏览器再重新打开后,我们就需要再次进行登陆(如果没有进行下次自动登录之类的设置).在Jav中(Session是通用的,这里以Java为例) ...

  6. Coupled model

    常见的coupled models phase English paper WRF-Chem mechanism public data 一些重要的结论 干空气的状态方程 ECWMF驱动WRF 常见的 ...

  7. TB3_Autorace之交通杆检测

    利用blob检测算法识别交通杆,控制TB3机器人完成对交通杆的起停动作! 上一篇博文中<TB3_Autorace之路标检测>订阅了原始图像信息,经过SIFT检测识别出道路交通标志,这里我们 ...

  8. SpringMVC源码剖析2——处理器映射器

    1.处理器映射器 HandlerMapping 一句话概括作用: 为 我 们 建 立 起 @RequestMapping 注 解 和 控 制 器 方 法 的 对 应 关 系 . 怎么去查看 第一步: ...

  9. 全文检索ElasticSearch的简单使用笔记

    工具:kibana GET _search { "query": { "match_all": {} } } #创建索引结构 PUT sku { "m ...

  10. python反转链表和成对反转

    https://www.cnblogs.com/tianqizhi/p/9673894.html https://blog.csdn.net/weixin_34168700/article/detai ...