單人做一個網站需要掌握哪些知識?

想學習如何做一個網站,卻又不知道從哪裡入手。請各位大牛給點方向性的意見,比如如何學習?學什麼?學到什麼程度?

強調一點,是自建網站。


這麼巧, how2j.cn/t/44 , 就是我一個人單獨做的~

做了有一年半了,現在每天有1000個人訪問,流量可真低呢,哈哈

簡單列羅一下網站功能,以及需要什麼知識, 當做題主學習思路的一種參考吧

1. 網頁上要顯示內容,需要學學HTML,比如這個頁面,有文字,有圖片。

2. 光有文字還不行,還要考慮不同的顏色,布局,排版,如圖做出這樣頁面效果,要學學基本的CSS

3. 有一些交互,比如修改了代碼可以實時看到效果,得掌握Javascript

4. 直接寫CSS太累,需要套用別人寫好的,來得快,也比自己做出來的好看,那麼就可以用用Bootstrap

5. 現在網站有1000多張頁面,不可能做1000張html呀,所以這些都需要維護在資料庫裡面,那就學一個簡單的MySQL

6. 現在一共有55張表。。。。 怎麼維護他們之間的關係~ 彼此如何依賴,外鍵如何關聯,這個需要學習表關係的相關知識

7. 有了資料庫,也有了表,那麼如何從這些表裡取數據呢? 我用的是JAVA技術棧,那麼就需要用到JDBC

8. 為了使用JDBC不是需要Java基礎嗎? 為了僅僅滿足JDBC的運行,需要如下JAVA基礎

面向對象,變數 操作符 控制流程,數字與字元串,異常處理,集合,嗯,剛剛夠

9. 這樣JDBC就可以取出數據了,那麼取出來之後怎麼顯示在HTML上呢? 需要用到JSP

10. 為了JSP可以運行,需要一個Servlet容器,TOMCAT,簡單用用就可以了

11. 可是TOMCAT總不能在自己機器上跑嘛,要放在公網上,運行,其他人才看得到呀,所以需要掌握如何在LINUX里部署Tomcat

12. 那麼掛在公網上的Linux自己怎麼弄呢? 我也弄不來,我是在阿里雲租的LINUX雲伺服器

13. 隨著網站提供的功能越來越多,光用JSP開發太慢了,而且難以維護,這個時候就用到了Struts 加快開發效率

14. JDBC也有點難以維護了,那麼就換成了Hibernate

15. 為了讓Struts和Hibernate更好的整合在一起,那還得學學Spring以及這3個的整合

16. Struts常常有漏洞產生,所以還得時常打補丁,真後悔當初沒有用SSM那套呢(其實當時也不熟SSM,哈哈~)

17. 為了更好的講解知識點,錄了教學視頻,所以還得會錄屏軟體。。。。

18. 這些視頻放在youku不太好,會有廣告,放在雲盤也不好,會被莫名其妙舉報而關閉,所以還是放在自己網站吧。 那麼為了播放,還的學會html5的播放方式

19. 看視頻太慢,所以再加個不同速度的播放按鈕,以及回放按鈕

20. 隨著訪問的人數增多,看視頻的人有個3,4個人同時看的時候,視頻播放就卡成狗了,所以為了播放順利,得把視頻放在OSS上面去

21. 可是視頻也多呢,一個一個得手動上傳多麻煩,那就得調用阿里雲的API,用Java幫你自動上傳

22. 還有些和開發技術無關的,也是需要掌握的,比如域名,要自己去選購一個,也是在阿里雲買的, 以前叫域名里包含java這個商標,害怕被oracle拿回去,就改了。

23. 光有域名還不行,當伺服器是在國內的時候,是需要備案的。 備案流程現在簡單多了,基本上7天就可以做完,不過其中有一個挺麻煩的地方,需要自己手寫簽字,然後再掃描出來發過去,可是我沒有掃描儀呢,去樓下店裡掃描又嫌麻煩,怎麼辦呢。。。。剛開始是在淘寶買5元的那種幫掃描的。。。 後來發現有的網站可以提供手寫字體,於是把手寫字複製下來,再ps到要填的單子上,發過去就行了,這個可是我十分得意的備案經驗喲,哈哈

嗯~ 好像就這些吧~ 一眨眼看,貌似需要的知識也不少,其實很多很多的知識,在一開始做這個網站的時候,我都是不會的,比如Linux(掩面),HTML5播放視頻,阿里雲API。

剛開始做的時候,其實就是很基礎的增刪改查一套,做得過程中,發現需要做某個功能,做這個功能的時候再去學需要的知識,這樣隨著網站功能得一點點豐富,自己的知識,技能也成長了起來了。 和打遊戲的道理一樣一樣,先整點簡單的小副本,干點小BOSS,裝等提升一些,技能熟練一些,多打幾個小副本,到了進團隊副本的時候,裝等,技術也跟著就上來了嘛。

所以回到題主的問題 「給點方向性的意見,比如如何學習?學什麼?學到什麼程度?」。

試著自己做一個對別人有價值的個小網站嘛,簡單的那種,比如分享你收集的PDF,小軟體,考試題目什麼的,以功能需求為導向,按需學習,這是最好的學習方式,也是最有意思,最有樂趣的方式。

從頭到尾做一個站,像是搭一個積木;更像是設計並建造一棟建築,你熟悉裡面的一磚一瓦,這裡面凝聚了你的創造性和靈感;甚至更像是你的小孩,你看著他一天天長大,裡面有你的心血,懊惱,奮鬥,挫折,成長,收穫。

感謝這個時代,提供給我們這些獨行者這樣的環境,條件,機遇去做一件允許自己沉醉其中的事業。

其他相關:知乎上前端開發領域有哪些值得推薦的問答? - 知乎

收藏的同學,請記得點個贊~


我就是自己做了一個網站(建築一網 http://www.jianzhu1.com),七月1號做好的,現在上線大概20天吧。現在每天大概有400人訪問吧,閱讀量在1000左右,真的很低呢,新站都是這樣吧。

圖1:網站logo 和我的更新記錄

圖2:網站現在的完成圖

做網站很難嗎?我一開始也是這麼認為的,可是經過一段時間摸索之後,我覺得做網站還是可以入手的,關鍵是這個過程很有趣。

下面我們就一步一步分解做網站這個過程吧。本次回答的前四點可能和其他回答都差不多,重點看本回答的第五點吧。這是我自己整理的結果(比較長)。

一、首先你需要一個域名和一個空間。

域名我是在Namesilo上買的,空間是騰訊雲的,這些前面的回答都有了,我就不一一說了。

圖3:我是在這個網站上買域名

騰訊雲目前運行的還不錯,而且後期還支持QQ登陸的介面,還是很適合我這個網站的。

二、其次,你需要去安裝運行環境Nginx

這個,老實說我也是折騰了好多次,好痛苦啊!之間伺服器都格式化了好幾次,有一點不滿意我就刪掉重來,終於摸索了我自己的路。

我這裡是按照oneinstack的方法去安裝的,安裝他們官網的安裝步驟(安裝 - OneinStack)去做就沒有問題。安裝好的截圖如下圖所示。

圖4:安裝oneinstack成功提示

三、你需要一個FTP軟體

這裡我隆重推薦WinSCP軟體,真的是我用過最好的FTP軟體了,還有Linux的操作介面(下圖紅色箭頭)。

圖5:WinSCP軟體界面

四、你需要安裝WordPress,並選好主題

然後我的做法就是把WordPress下載下來,通過FTP直接拖動到空間裡面,這樣WordPress就安裝好了。然後設置一下用戶名和密碼就可以了。

主題主要是根據你網站的用途來定,企業網站、個人網站、BBS論壇所用的主題是不同的。

五、個人有用的小經驗(特別好用)

(WordPress使用經驗總結(微信機器人+B站視頻+美化文章內標題的標籤)-建築一網--施工、材料、設計一體化)

Simple Tags 插件 實現網頁內鏈(修改支持中文)

騰訊雲CDN緩存設置經驗-建築一網--施工、材料、設計一體化

如何上傳sitemap.xml文件-建築一網--施工、材料、設計一體化

WordPress在側邊欄插入圖片技巧-建築一網--施工、材料、設計一體化

使用騰訊雲cdn之後的速度測試--基本滿意-建築一網--施工、材料、設計一體化

階段性總結--WordPress最近的折騰-建築一網--施工、材料、設計一體化

下面挑幾個有代表性的經驗放在下面分享給大家。

5.1、自由連接網站和微信公眾號

眾所周知,微信公眾號裡面功能最弱的就是沒有認證的個人訂閱號了。不是我不想認證,是微信現在關閉了個人的認證了。這就導致微信公眾號的很多開發功能無法使用到。比如這次,我想用水煮魚大神的微信機器人插件來讓我的網站和公眾號可以自由連接,就必須要使用一點「巧勁」了。

首先大家一開始都以為,未認證的公眾號,在微信公眾平台在微信自己的後台提供了自定義菜單設置的功能,但是沒有開放創建菜單的介面。所以這個就是2選1的問題:

1. 所有的操作都在微信後台進行設置。 2. 為了使用使用微信機器人的自定義回復的功能,放棄自定義菜單功能。

魚和熊掌是不可兼得的。

可是事實上,沒有認證的個人訂閱號,是可以做菜單的。可以在我的公眾號「建築一網」上看一下效果。

http://weixin.qq.com/r/0z9QSIjEVdUqrcwr92rB (二維碼自動識別)

具體做法:

不需要在微信機器人做,而是在公眾號里做。

1.先在「開發-基本配置」里,把配置停用。

2.在自定義菜單里配置菜單。

3.然後「開發-基本配置」里,把配置啟用。這時候配置的菜單就失效了,不過沒關係。

4.點「添加功能插件」,添加「自定義菜單」,點擊啟用。

注意:以上四步設置完成之後,需要把WordPress伺服器重啟一下,不然微信機器人會沒有響應。Nginx下面重啟伺服器的命令是:

service nginx restart

下面,我將用視頻演示一下操作過程:(可能移動端無法看這個視頻,大家可以去B站關注我的賬號「建築一網」來觀看。)

視頻封面如何讓沒有認證的個人訂閱號可以自由連接網站和微信公眾號_機械_科技_bilibili_嗶哩嗶哩bilibili.com視頻

本視頻重點:如何讓沒有認證的個人訂閱號可以自由連接網站和微信公眾號?

第一步、先在「開發-基本配置」里,把配置停用。

第二步、在自定義菜單里配置菜單。

第三步、然後「開發-基本配置」里,把配置啟用。這時候配置的菜單就失效了,不過沒關係。

第四步、點「添加功能插件」,添加「自定義菜單」,點擊啟用。

然後,我們來試一試。我這裡可以正常使用了,是因為我之前重啟過WordPress伺服器了。如果不能使用的話,可以到後台WordPress來重啟伺服器。

操作步驟如下:

第一步、打開WinSCP軟體。

第二步、登陸,並進入Linux系統。

第三步、輸入重啟命令 service nginx restart

這樣就么有問題了。

建築一網微信公眾號主要有兩大作用,第一是分享建築結構相關知識,第二利用該微信公眾號查詢「建築一網」博客中的文章。

查詢功能說明:

相關查詢指令:

輸入n返回最新日誌

輸入R返回隨機日誌

輸入t返回最熱日誌

輸入C返回最多評論日誌

輸入t7返回一周內最熱日誌

輸入C7返回一周內最多評論日誌

輸入h獲取幫助信息!

輸入「關鍵詞」查詢建築一網的相關文章。

查詢步驟如下:

在搜索中搜索不到需要的內容,請更換關鍵詞重新搜索,搜索只能搜索博客(http://www.jianzhu1.com)中的內容,網站中會根據網友提出的問題進行更新相關的內容,如果你有什麼問題,請給我們留言,我們會在微信公眾號和網站中進行相關更新。

5.2、在wordpress中引用B站視頻

在wordpress中引用B站視頻如果直接用官方的分享代碼經常會出錯,視頻經常會顯示找不到,所以小編給大家一個方法就是用下面這個代碼,每次只要替換代碼中小編標識的粗體數字那邊就可以!

如:http://www.bilibili.com/video/av4277134/

數字就是B站視頻地址中av後面的數字

&&

5.3、如何美化文章內標題的標籤

就是實現圖示功能

其實是通過CSS定義了內容中的H標籤的樣式,直接將下面的代碼添加到你的style.css中即可:(h1、h2、h3分別是一號標題、二號標題和三號標題)

.article-content h1{ font-size:26px; color: #FF0000; font-weight:bold; border-bottom: 1px solid; padding: 5px 15px; border-left: 8px solid; margin:18px 0px 18px -20px; overflow: hidden; }

.article-content h2{ font-size:18px; color: #FF0000; font-weight:bold; border-bottom: 1px solid; padding: 5px 15px; border-left: 8px solid; margin:18px 0px 18px -20px; overflow: hidden; }

.article-content h3{ font-size:12px; color: #FF0000; font-weight:bold; border-bottom: 1px solid; padding: 5px 15px; border-left: 8px solid; margin:18px 0px 18px -20px; overflow: hidden; }

5.4 添加QQ在線客服功能

實現的效果如下圖所示,點擊QQ交談就會激活QQ應用,進入人工客服在線交流窗口。目前在Windows和Android手機測試均通過,IPhone和IPad測試未通過,主要是代碼造成的,我將在下次的更新中補充。

如何做到呢?首先去下載js文件,下載地址如下:(待更新)

最近太忙了,下午繼續更新。也歡迎大家關注我的專欄「建築一網」。

嗯,首先需要下載js文件,地址我已經把鏈接做出來了,在 http://pan.baidu.com/s/1nuNdzxn

下載之後有兩個文件,分別是kefu.js 和kefu_011.gif。如下圖所示:

打開之前提到的WinSCP軟體,把MC_kefu 文件夾整個拖動到右側窗上傳到伺服器。注意,一定要放到你網站的根目錄,就是和wp-admin、wp-content在同一文件夾。

雙擊打開MC_kefu文件夾,打開kefu.js文件。將QQ號碼改成自己的QQ號碼,同時按照需要更改qq類型,我的是個人QQ。

在要加入QQ客服的頁面的&與&標籤中插入以下代碼

位置在主題目錄下的footer.php文件。一定要拉到最後的&前面插入

&