整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
本人的個人博客網站，網站地址，是基于VuePress進行搭建。
根據官網：VuePress 由兩部分組成：第一部分是一個極簡靜態網站生成器， 它包含由 Vue 驅動的主題系統和插件 API，另一個部分是為書寫技術文檔而優化的默認主題， 它的誕生初衷是為了支持 Vue 及其子項目的文檔需求。每一個由 VuePress 生成的頁面都帶有預渲染好的 HTML， 也因此具有非常好的加載性能和搜索引擎優化（SEO）。
同時，一旦頁面被加載，Vue 將接管這些靜態內容，并將其轉換成一個完整的單頁應用（SPA）， 其他的頁面則會只在用戶瀏覽到的時候才按需加載。
事實上，一個 VuePress 網站是一個由 Vue、Vue Router 和 webpack驅動的單頁應用。 如果你以前使用過 Vue 的話，當你在開發一個自定義主題的時候，你會感受到非常熟悉的開發體驗， 你甚至可以使用 Vue DevTools 去調試你的自定義主題。
在構建時，我們會為應用創建一個服務端渲染（SSR）的版本， 然后通過虛擬訪問每一條路徑來渲染對應的HTML。
1、在開始之前我們需要確保你的本地是由nodejs的環境，我們先來驗證一下， 打開的命令行工具，我的是mac所以打開的終端（Windows打開cmd），輸入一下命令：
node -v
說明：出現版本號，說明你本地是有環境。
2、接著我們來驗證是否有npm工具：
npm -v
如果有的小伙伴沒有相關環境：請按如下提示進行環境準備
1、下載nodejs
登錄nodejs官網：nodejs官網
下載符合你個人系統的軟件，進行安裝，安裝過程很簡單，這里就不過多贅述。 安裝完成后，繼續上面所說的進行驗證node的版本和npm的版本
1、創建目錄
在你的終端執行進行入的放放置項目的目錄，創建一個目錄，如下命令：
// 進入一個目錄
cd 你的目錄
//創建一個 blog_web 目錄
mdkir blog_web
2、初始化目錄
//進入 blog_web
cd blog_web
//初始化目錄
npm init -y
根據提示設置一些必要的信息，無需設置直接回車，最后輸入yes，設置完成后，如下圖所示：
此時，blog_web目錄先會有一個package.json文件,打開文件看一下有什么信息。
//編輯文件
vi packag.json
{
"name": "blog_web",
"version": "1.0.0",
"description": "我的博客網站",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "北漂碼農有話說",
"license": "ISC"
}
可以看到，就是我們剛才設置的一些信息。
3、安裝VuePress
//安裝在你的目錄下
npm install -D vuepress
也可以進行全局安裝
npm install -g vuepress
全局安裝以后在任何目錄下都可以使用VuePress
安裝完成后可以看到項目下多了一個目錄node——modules，這里都是我們需要依賴的文件。
4、創建你的博客相關目錄
在blog_web目錄下創建一個docs目錄，進入docs目錄創建.vuepress目錄， 創建一個README.md文件，涉及的命令如下：
mkdir docs
cd docs
mkdir .vuepress
5、配置網站頭
進入.vuepress目錄下創建，config.js文件，配置以下信息
module.exports = {
title: '北漂碼農優化說',
description: '歡迎來到我的博客'
}
6、配置網站首頁
進入docs目錄，打開README.md文件，配置如下內容：
---
home: true
heroImage: http://cdn.triumphxx.com.cn/img/%E9%A1%B5%E5%A4%B4.jpg
heroText: 北漂碼農有話說
tagline: Java 全棧技術交流平臺
actionText: 開始學習 →
actionLink: /
features:
- title: 純原創
details: 不做互聯網的搬運工，我們踏實搞技術。
- title: 成系列
details: 成系列的教程合集，告別碎片化學習，Java 學習一步到位！
- title: 有案例
details: 文章都有配套案例，搜索微信公眾號【北漂碼農有話說】，及時獲取文檔更新通知！
footer: 關注微信公眾號【北漂碼農有話說】，眾多技術呈現給你！
---
7、啟動項目
進入到blog_web目錄，加入如下腳本
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "vuepress dev docs",
"build": "vuepress build docs"
}
在終端執行如下命令，啟動項目：
npm run dev
出現如下信息說明啟動成功
進行訪問http://localhost:8080/
出現上面的畫面，那么恭喜你，你想網站已經啟動成功。
1、配置網站角標
現在網站的頭部很單調，我們需要進行優化
進入.vuepress目錄下，在config.js文件下設置hand的信息，如下：
module.exports = {
title: '北漂碼農有話說',
description: '歡迎來到我的博客',
head: [
['link', {rel: 'icon', href: 'http://cdn.triumphxx.com.cn/img/%E5%85%AC%E4%BC%97%E5%8F%B71.jpeg'}],
],
}
2、配置網站logo、導航欄、側邊欄
進入.vuepress目錄下，在config.js文件下信息，如下：
module.exports = {
title: '北漂碼農有話說',
description: '歡迎來到我的博客',
head: [
['link', {rel: 'icon', href: 'http://cdn.triumphxx.com.cn/img/%E5%85%AC%E4%BC%97%E5%8F%B71.jpeg'}],
],
themeConfig: {
logo: 'http://cdn.triumphxx.com.cn/img/%E5%85%AC%E4%BC%97%E5%8F%B71.jpeg',
nav: [
{text: '首頁', link: '/'},
{text: 'Java', link: '/java/'},
{text: '前端', link: '/web/'},
{text: 'GitHub', link: 'https://github.com/triumphxx'}
],
sidebar: {
'/java/': [
'',
'java1',
'java2'
],
'/web/': [
'',
'web',
]
}
}
}
配置完成后，需要在docs目錄先創建java目錄，并且在java目錄下創建，READNE.md、 java1.md、java2.md文件，同理創建web目錄。項目目錄結構圖如下：
.
├── docs
│ ├── README.md
│ ├── java
│ │ ├── README.md
│ │ ├── java1.md
│ │ └── java2.md
│ └── web
│ ├── README.md
│ └── web.md
├── package-lock.json
├── package.json
└── tree.txt
3、查看網站效果
首頁
java
找一篇文章我們看一下效果
這樣我們的靜態博客網站就搭建完成了
好啦，小伙伴們，到此我們的靜態博客網站就基本搭建完成了。至于如何部署上線，微信搜一搜【北漂碼農有話說】 我們下回分享。
/邵麗萍
當寫作不再專屬于“作家”，也不是好比“神壇”上的圣物時，我們開始迎來全民寫作時代。
半路出家相比較人家專業的，自然會有些差距。
隨著簡書、公眾號、、百家號等各個寫作平臺的誕生，越來越多的人開始用文字抒發自己的情感。
但是，在這里，文字好比骨架，而文中的配圖就好比妝容、外衣。
人靠衣裝佛靠金裝，一個好的文章，配圖尤為顯得重要。我常常看到很多人，文字功底還不錯，只可惜用的配圖要么像素差、要么圖不對文。
到最后，好好的一篇文章，配圖成為了一大敗筆！
這里，講給大家介紹幾個，我長期安利的配圖網站。
Julian Glander是一位動畫師、插畫師，網頁中的動態圖片，基本上是以動漫模式展現。
網頁鏈接：http://glander.co/
Pd網頁純英文，像我一個英語小白是看不懂啥意思，不過沒關系，我需要的是圖片。網站圖片還是以清新、自然為主調。
網頁鏈接：http://publicdomainarchive.com/page/3/
pexels同樣是純英文界面，很羨慕英語達人一覽無遺的感覺。支持詞匯搜索圖片，因為是英文網頁，所以你會發現圖片素材基本都是國外的。但是質量絕對不錯，非常簡約清爽，個人很中意。
網頁鏈接：https://www.pexels.com/discover/
Rabbit全英文界面，因為圖片沒顯示之前都是一只兔子，所以我就叫它Rabbi。哈哈，希望英語達人給我翻譯一下。網頁的圖片還是比較夸張的，但是又很幽默詼諧。
網頁鏈接：http://www.gratisography.com/
終于來一個中文版，我看得懂得。別樣網的圖片，在他們的微博官網上會同步更新，所以獲取圖片很方便。這是我唯一覺得不錯的國內配圖網站，可能有人會說“花瓣網”也不錯。那我只能說個人審美不一樣，就好比我從來不用美圖秀秀，而是用Snapseed。別樣網的美食照片，很贊。
網頁鏈接：http://www.ssyer.com/home-index_l_46.html
新浪微博： 別樣網
自從上次分享了我的“修煉型”APP以后，無論是在公眾號還是簡書，都受到大家強烈的喜歡。
所以，就有了今天這篇干貨分享。果真分享是一件超級有成就感的事情，看來以后我要在分享這條路上越走越遠了。
我相信還有很多優秀的配圖網頁，只是這幾個是我一直親身感受過、使用過的配圖網頁。雖然沒有高超的攝影技術，但是一定水平的審美觀還是有的。
容我想想下次給大家分享什么好東西，有好建議的記得給我留言，我愿做個“忠實分享者”。
蘋果本月初的Apple Watch發布會上，作為首批支持Apple Watch的應用之一，微博推出了“微博運動”的新項目，企圖利用Apple Watch中的健康互動功能，幫助用戶實時記錄與分享運動數據。雖然Apple Watch要到4月24日才會全球正式上市，但微博今日更新了iOS客戶端，提前讓我們體驗“微博運動”功能。
| 軟件名稱： | 新浪微博 |
| 軟件版本： | 5.1.5 |
| 軟件大小： | 71.40MB |
| 軟件授權： | 免費 |
| 適用平臺： | Touch iPhone |
| 下載地址： | http://dl.pconline.com.cn/download/161076.html |
此前，據微博官方公布的方法顯示，用戶完成微博賬號與iOS設備捆綁后，即可在iPhone端和Watch端同步記錄運動數據。在Watch端，用戶分別可以看到自己的基礎信息，在所關注人當中的步數排名和卡路里消耗排名，以及正在參與的活動/任務，微博還會充分利用Apple Watch在推送通知方面的優勢，展示多樣化的內容，豐富用戶體驗。
微博運動直接嵌入在客戶端個人主頁的功能選項里
初次使用需要簡單地設置用戶數據
在iOS版微博客戶端V5.1.5中，“微博運動”直接嵌入在客戶端個人主頁的功能選項里，用戶點擊即可進入主界面。主界面目前僅顯示“基礎數據”，“基礎數據”部分可查看用戶的基本運動數據。據悉晚些時候，微博運動還將上線“活動任務”。通過“活動任務”，用戶可參與明星和團體發起的健身活動。
設置完成個人資料后，便可以顯示用戶的基本數據
隨著全民健身上升為國家戰略，人們對健康狀況的日益重視。而如今越來越多的智能設備將對運動數據的記錄和監測作為主打功能推出。然而，簡單的數據對于運動個體而言是相對枯燥而不直觀的，且不具備激勵參與的機制。如何激勵用戶更多地參與運動，則讓各大設備廠商頭疼不已。早前，微信運動則推出了以“好友運動PK”的主題進行健身運動對比。鼓勵大家好友間互相比拼健身運動。
微信運動是基于好友圈里的好友運動PK
而新上線的“微博運動”，則改變了以往運動型App“個人記錄”或者“好友運動PK”的模式，而是連接了智能穿戴設備、運動數據和微博社交平臺，不僅使枯燥的數據有了豐富的應用場景，用戶還能在社會化平臺享運動數據，參與明星、好友發起的活動，進行互動，并獲取運動健康相關的服務，全面提升了參與感和運動的樂趣，吸引用戶更好地參與。
而微博運動則可以通過社交平臺，進行全平臺互動
此外，作為用戶規模最大的移動應用之一，微博一直在強化與蘋果的合作，利用本次客戶端的捆綁契機，通過用戶授權，微博將可以獲得自有平臺上活躍著的上億蘋果用戶授權的運動數據，成為擁有用戶運動數據最多的應用。熱愛運動的用戶趕緊來更新，加入全民健身的步伐吧!
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
