华为9元享一年学生机,前端菜鸟也能给别人看看本身作的项目!

活动

经同窗介绍,华为云学生机1年99元,在牛客网上还有返现活动,99元返90元,至关于一年只要9元。 刚开始作前端的同窗们,买一个服务器,再将本身作的项目部署至服务器。 临近毕业,作一些完整的项目,参加面试时也可展现本身的项目。9元买不了吃亏买不了上当。 【学生福利第二波】买云服务器返现≈免费送,还送手环! 具体购买流程点击上方链接html

服务器

介绍

购买成功后记得申请返现哦! 进入华为云管理后台 前端

图片说明
图片标题
能够看到咱们刚刚购买的学生机 (考虑到刚入前端坑的同窗们,服务器这里才用Windows Server 2008 R2操做系统 windows操做系统你们都比较熟悉,容易上手——) 1.表明公网ip 也就是咱们能够在公网上访问到这台机器 2.表明内网ip 至关于咱们本身的电脑在局域网内的ip

远程桌面

首先 刚刚建立无缺像没让咱们设置服务器密码 因此我也不知道服务器密码是多少 这里点击重置密码, 输入新密码并重启。 这里密码在下一步远程链接桌面的时候须要用到 vue

图片说明
图片标题
点击桌面左下角win 输入远程桌面
图片说明
图片标题
输入刚刚1.公网ip 并输入刚刚设置的密码 便可链接到咱们华为云学生机windows系统桌面
图片说明
图片标题
记得咱们要用Administrator这个用户 点击确认 此时即可链接成功
图片说明
图片标题

安装node等

node安装 在远程桌面cmd.exe输入node -v 获得node版本号 说明安装成功 node

图片说明
图片标题

express 创建前端服务器

因为在服务器没有安装编辑器 因此咱们在本地电脑编写代码后再复制到服务器 新建文件夹 在cmd命令下 npm init 建立node项目 面试

图片说明
图片标题
成功后生成package.json文件 该文件配置了项目名称 入口文件等 新建index.js入口文件

const express = require("express");
const app = express();

//ip&port
var hostName = "127.0.0.1";
var port = 8082;

//静态资源
app.use(express.static("publick"));

//启动服务
app.listen(port, hostName, function () {
  console.log(`服务器运行在http://${hostName}:${port}`);
});
复制代码

下载express:npm install express -S 新建文件夹public 放前端文件 并建立index.htmlexpress

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
   hello world !
</body>
</html>
复制代码

启动nodex项目:node index npm

图片说明
图片标题
打开浏览器 输入url 成功打开网页
图片说明
图片标题
node项目建立成功 (若是你的前端项目是vue框架 执行npm run build 打包 将打包完成后的文件(index.html和static文件夹)复制到该项目的public文件夹内替换便可)

从公网访问咱们刚才的项目

将刚才写好的node项目复制到华为云服务器上 Ctrl+c Ctrl+v 便可json

右键index.js 点击编辑 更换hostName为服务器的内网ip 服务器的内网ip公网ip可在华为云控制台上查看 windows

图片说明
图片标题
将hostName更换为内网ip
图片说明
图片标题
点击保存 在文件夹内空白按住shift建+右键 再此处打开命令窗口
图片说明
图片标题
键入node index
图片说明
图片标题
启动成功! 如今咱们已经在公网上运行了咱们的项目,可是因为华为云 安全组策略并无开放8082端口,须要自行配置 打开华为云服务器控制器 点击进入
图片说明
图片标题
点击更改安全组规则-入方向规则
图片说明
图片标题
这里演示添加全部端口,也可根据项目添加相应的端口
图片说明
图片标题
点击肯定。 此时,咱们就能够在公网上访问咱们的项目了,url为公网ip:端口号 咱们的端口号就是咱们index.js内配置的port(这里是8082)
图片说明
图片标题

访问成功,大功告成!!!浏览器

相关文章
相关标签/搜索