華爲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)
圖片說明
圖片標題

訪問成功,大功告成!!!瀏覽器

相關文章
相關標籤/搜索