Python新手使用Django架站技術實作:活用Django 2.0 Web Framework建構動態網站的16堂課

博客來網頁

Django 是一個 web 框架,他由 Python 寫成,最近也越來越多公司有這方面的需求。這本書提供了一個很好的起點,當然啦,網路上也有許多免費的資源,若是自己奮鬥,應該也能開始使用,不過總覺得藉著零散的資料很難去理解完整的大架構。所以最後還是精挑細選了這本書來啃 ( 是說台灣好像也沒有太多 Django 的書可以選擇…QQ ) ,這本書很完整的整理了所有的步驟跟說明,按照著這本書可以很清楚的理解這個框架內的互動關係,其實我覺得無論是有沒有要架網站或是找這方面的工作,仍然適合拿來練習未來大專案的開發。Django採用的是 MTV 架構,從 MVC 架構轉變而來,跳出 Django 外,很多網站或是專案也是採用 MVC 架構或是原理來開發軟體,這邊的基礎打好相信對於大型專案也會有相當的幫助。像我自己目前就用 Django 的架構來寫公司的 ERP 系統。

尤其 Django 用的又是 Python 語法,相對平易近人,資源也多而且使用者比例越來越高。並且這本書難度不高,按表操課,照著做的話應該一個禮拜內就可以跑過整本書的流程,是一本相當推薦給大家的書。若是想要自己搭建部落格的,依照他的流程應該也可以蠻順利的完成架設。

不過這本書相對來說,沒有特別著墨在前端( 如果說想要看到美美的網頁的話…. )的部分,這部分可能需要尋找其他的資源,儘管如此現在的業界中,若是只懂前端或是後端的話,很難讓自己能夠爭取好的薪水跟職缺,由這本書當起點,再看之後要往哪邊發展,相信也可以讓自己的未來的道路更加明確。若是要應用的話也可以搭配這本使用,應該就能初步的掌握 Django 的框架了。

django專案建立(Pycharm免費版)

今天要來快速的建立 djanog 專案。若是在下載 Pycharm 的時候不想付費 ( 付費版教學 ~ ),也沒有教育版可以使用的話,沒關係還有一個選項是用 Community 的版本。不過使用 Community 的版本的話就沒有辦法自動建立專案,必須要手動完成,不過幸好步驟相當簡單:

首先大家可以看到,左手邊沒有專案類型可以選擇,所以這個步驟就選擇好自己專案的路徑後,按下create就好。

接著要去C:\Users\使用者帳號(自己的)\Anaconda3\Scripts 這個路徑中,找到django-admin.ext這個檔案,也可以用右上角的搜尋找,把這個檔案複製好

複製好之後,打開我們一開始建立專案的資料夾,並把剛剛複製的執行檔放進入:

接著回到 Pycharm 的介面中,按左下角的 terminal 打開他的視窗。並輸入下面的指令:

django-admin.exe startproject firstSite

其中 firstSite 可以替換,也就是這個 django 專案的名稱。執行完後,可以看到左上角也多出一個資料夾,專案就建立好囉~~

Django 專案建立

安裝好 Pycharm 後就可以開始建立 Django 專案了,進入 Pycharm 可以選擇創建新專案 ( 或是在【file】中找到【New Project】),若是安裝的是付費版 ( 如果有學校信箱的話,可試試看能不能申請免費教育版,這邊申請~ ),能夠自動替你創建好不同的專案,在左邊點擊【Django】。

接著自訂專案儲存的位置,也可以使用預設的路徑,不過要記好專案的位置。按下Create就會自動生成專案了。

給他一點時間,Pycharm正在努力的替你背後工作 > <

等到他跑完之後檔案就建立好了,這邊看似簡單的幾個步驟,若是不是使用 Pycharm 付費版的話,依然樣可以使用其他方式完成這些專案,不過就要一個步驟一個步驟自己處理,回想起這些曾經步驟也是充滿著我的血和淚…. 所以如果可以的話,一定要想辦法弄到商業版的 Pycharm 來用。等到出現下面的畫面的時候,專案就建了好囉~~

按照之前選擇的路徑去看,也可以看出資料夾中出現了和專案左邊一樣的名稱。而這些檔案也能手動產生,等我有時間我也會再做個簡單教學。 所以反過來講,我們也可以不利用 Pycharm 就在電腦中完成這些動作。

專案建好了,我們來試試看這個專案執行起來會是怎麼樣吧 !! (相當於你把它放上網路後,其他人看到這個專案的樣子 !! ) ,而 Pycharm 這邊也非常貼心的讓你一鍵就能完成,只要按下右上角綠色三角形的符號,再等待一下即可~~~

出現下面的畫面就執行好了,最後再點下面紅框框的部分,或著也可以再瀏覽器中key入這個網址,就可以看到自己的第一個專案囉~~

下面這個頁面是 Django 內建的的頁面,當你看到這個頁面的時候,就代表你成功的建好專案囉,未來自己在建立專案後,可以先試試看能不能看到這個畫面 !! 接下來,我會帶著大家用試寫一個網頁放到專案當中 !!

Pycharm安裝

這個是 Django 專案開發的第一篇文章,如果不知道 Django 是什麼的可以看這篇文章,或是請教一下偉大的 Google 大神,很多前輩也都有相關的介紹~

雖然我放在 Django 中介紹,但是其實 Pycharm 可以用在任何 “Python專案” 的開發。任何一個比較大型的專案中,基本上不會只由一隻程式所組成,往往是許多小程式彼此交互運作,若是手動自己建立資料夾管理也 OK,但就需要花更多的時間來控制整個專案中的所有程式和路徑。利用 Pycharm 可以輕鬆並且直覺的管理你的專案。另外,像是接下來要示範的 Django ,需要先利用 cmd 開啟某支程式來建立專案,但在 Pycharm 中則可以輕鬆的完成這個任務,今天我們先來安裝好 Pycharm,下次我會教大家如何在自己的電腦建立 Django空白專案,然後就可以開始正式使用 Django 來開發有趣的專案囉~

首先先到官方網站下載 Pycharm ,接著就按照下面的步驟進行:

點選中間【Download Now】
這邊點選右手邊 Community免費版,左手邊是付費版的
若是在這邊勾選的話,會在桌面創立捷徑
這個步驟問你要不要導入之前的設定
(會看這篇的應該用下面的設定就好了XDD)
這邊可以選擇開發介面的顏色(看是要文青黑還是正常的白色)
這邊是新專案的路徑,可以記錄下來以免未來找不到專案的位置

好啦,Pycharm 就這樣安裝好囉~~如果是高手的話就可以自己玩玩看利用 Pycharm來建立專案囉~ 如果是新手的話,接下來可以跟著 TinyCorner 的腳步一起完成自己的第一個 Django 專案~~

網站與網頁—Django 初見面

這篇會先聊一下傳統網站的構成,其實最一開始,我們所逛的網站單純是由很多很多 ” 張的網頁所構成 ” ,而所謂的網站,指的就是這些網頁的集合,藉由某一頁網頁中的超連結連跳到另一個網頁,譬如說一個你在一個公司的入口網站中,點擊 ” 關於我們 “,接著就會跳出公司的詳細介紹,在你點擊的動作,其實就是單純跳到另一個網頁。而具有超連結的部分通常會用另一個顏色顯示(像是Django相關書籍介紹),點一下你就會跑到另一個頁面,按下上一頁就會回到上個頁面。最剛開始的網站就只是這樣在 ” 網頁們 ” 跑來跑去,進而找到需要的資訊。

這邊順便聊下” 網頁 “的產生,利用 HTML (現在已經發展到HTML 5 囉~)的檔案類型來” 編排 “整個網頁,注意 !! 這邊我講的是” 編排 “,沒錯,其實我們寫出來 HTML 的就是告訴瀏覽器這”網頁”要怎麼呈現給瀏覽網頁的人,他的腳色有點像是導演,告訴瀏覽器:這邊要放標題、那邊放個超連結、內文擺哪邊或是要不要呈現一個表格,最終進入我們眼簾的網頁就這樣誕生囉~~這整個過成,會像是我們去電影院看的最終影片,不會看到導演指導演員辛辛苦苦的過程。

前面說的是 ” 傳統的網站 “,其實在上面的步驟來說,嚴格上還沒牽涉” 程式設計 “,網頁只是單純對於呈現出來畫面的安排,所以其實只要記好幾個指令 ( 甚至可以查表就好….),大部分的人可以很快的上手網頁設計( 不過要做出一頁好看的網頁又是另一個故事了…)。聽起來很簡單吧,But !! 沒錯出現了一個討厭的 But,傳統方式已經無法滿足現代人對網站的需求了,你想像一件事:現在你進入一個公司的網站,結果只有看到一堆字跟超連結,偶而放個幾張圖片,捫心自問,你會不會覺得這家公司已經要迎接倒閉的命運了…。所以現在網站出現了一大堆有的沒有的功能,為了這些功能,我們必須要放入程式和這些網頁互動,除此之外我們甚至需要資料庫來把使用者資訊互動記錄下來(像是瀏覽紀錄、會員註冊、留言板或是使用者的客製化呈現…等)。這些已經不是光靠一個人可以在短時間內處理好,這些工作可能會被分給好幾個工程師一起完成,最後再塞在一起,如果就放在同一個資料夾中,幾百幾千個程式要互動起來…

為了避免這種惡夢的發生,後來出現了很多 web 的框架,協助工程師們把該放的東西放到他們該去的地方,只要位置放對的話,網站中的網頁與程式就會正確的運行。控制網站也變得單純:掌握好整個框架就可以把每一部分給劃分清楚,並讓他正確的運行。要用電影來舉例的話,像是現在一大堆” xx宇宙 ” 的系列電影。你不可能叫一個導演把所有整個宇宙的時間線跟所有故事架構出來。web 框架有點類似電影公司,他會把整個大架構給安排好,而導演編劇只要把故事影片塞到適合的位置就好。而 Django 是其中的一種 web 框架,為什麼要學習 Django 呢 ? 因為他是基於 Python 的程式語言所寫的,維持Python 一貫的簡潔爽感十足的特性。所以接下來小角落會推出一系列 Django介紹,並且試著利用 Django 來完成一個小專案,請大家拭目以待吧~~