🥤來開一家數位思維飲料店：『朕喝的茶』

文長，慎入

# 如何讓沒寫過程式的人快速寫出一個網站？從「學寫程式」轉化為「從案例學做產品」的思維

> 人們買電鑽，為的不是電鑽本身，而是為了牆上的洞

學寫程式也一樣，很多時候學寫程式或是學某個軟體，通常是為了讓生活更輕鬆好玩，或是讓人生擁有更多可能性，甚至是為了創業、轉職，而不僅是為了學會一個語言。

語言本身是工具，可以讓你跟外國人對話、可以幫你跟電腦溝通，但我們的目的不僅如此。

然而，我卻經常聽到身邊的朋友學習寫程式半途而廢，包括我自己也曾經學過很多程式語言、工具也都是半途而廢。

因此，如何解決「很多人學了程式卻沒學成」的問題，我認為關鍵是「想學寫程式」這個目標，需要定義得更清楚一些。

我發現沒能學成的問題不外乎是幾種類型：

1. 程式語言真的好難，電腦的運作邏輯難以理解
-> 打基本功的過程就失敗了

2. 學了之後不知道怎麼變成自己想要的東西
-> 理論與實務運用無法融會貫通

3. 就算變出想要的東西了，也不知道下一步、之後的細節
-> 需要實務上更多細節、經驗累積

解決這些問題的關鍵，我認為要從根本的學習模式調整，直接套用適當的案例題目，給沒有寫過程式的人練習，過程中以情境式的案例為主、增加樂趣跟學習成就感。

課程一開始減少艱澀的技術用語跟原理解釋，取而代之的是滑順的學習體驗，學生看到自己一步一步做出會動的產品，累積小成就感，也累積自信，並透過老師的解說，理解在真實世界的場景與電腦世界的邏輯是如何交互、連動的。

秉持著 #敏捷寫作 的精神，把目前尚未完全成形的想法寫出來跟各位分享分享。

## 情境式教學的想法，數位思維飲料店：『朕喝的茶』

一開始先不談歷史淵源典故、程式語言特性或原理，而是設計一個情境，給大家一種沈浸感，一起解決情境中所遇到的各種問題，從教學理論來說是以問題為基礎的學習模式（PBL，Problem-based learning），會讓學習更加有效、更能融會貫通。

例如：
~~~~~~~~~~~~~~
【情境】

康先生決定開一家手搖飲料店叫「朕喝的茶」，「朕喝的茶就是好」，喝好茶，就喝朕喝的茶。

但因為現在已經 2019 年了，報紙上都說要數位轉型，康先生覺得如果店先開了，才開始轉型，競爭力不足，不如從第一天就有數位化思維與營運模式。

因此，康先生找了一批熱血青年開始建立數位版圖，大家必須先替康先生決定數位版圖的大致樣貌，設計出飲料店日常營運的關鍵流程，將流程逐一拆解成使用者故事（user story），分析現實生活中的各種場景如何轉化到數位世界裡的流程與細節，是數位化的重要環節。

【分析】

一家飲料店常見的場景，有不同的使用者觀點：

1. 老闆：康先生每天都想知道今天賣了幾杯、什麼賣得最好？

2. 店員：店員的數學老師時常請假，怎麼樣才不會算錯錢、點錯飲料？

3. 消費者到店消費，消費者喜好多元且枯燥，怎樣點飲料、付錢才有效率？

4. 消費者在辦公室預購、團購怎麼更有效率，店員不想再接電話了，能不能網路下單？

~~~~~~~~~~~~~~

建構了這些場景之後，接著將個別場景的關鍵流程整理出來，逐一形成課堂上的講解、示範，並且讓學生實際動手練習。

像是飲料店老闆一開始必須要決定賣哪些飲料、有沒有冷熱飲、客製化選項有哪些、價格是多少，如此便可以將資料庫概念以及後台表單操作轉化為課堂上的練習，與此同時，開始解釋資料在網站後台、資料庫以及使用者的瀏覽器之間是怎麼流動的、使用者的互動（User interaction）是怎麼發生、又是如何操控的。

分析、拆解一個場景中的各種可能問題，並且以網路產品思維的模式解決之，其實涵蓋的也不僅是「程式設計」的問題，透過數位思維解決問題，還涵蓋了以下幾個不同領域的專業與見解：

1. 介面與互動設計（常聽到的 UI/UX 設計，包括看得到的與看不到的介面，像是聲控；而且一個完整的流程，通常是一連串的操作與互動，要考慮的還包括各種規則、流程、限制、回應等）

2. 數據分析（數據如何搜集、流動、匯集、整理、分析、呈現）

3. 系統營運（廣義的 DevOps，包括系統的負載量、穩定度、反應速度、備份備援等也都要考慮）

4. 協作模式規劃（一個人做產品，跟一群人做產品，考驗的不只是一個人寫程式的功力，而是協作的藝術）

一開始提到的，倘若你是因為有了某個點子，而起心動念想要學寫程式，那麼「寫程式」可能也僅是「電鑽」的一小部分，後面還有一連串要面對的事情。我的建議是重新定義目標，以終為始，分析需要的技能組合及最小可行性方案，如此人生會輕鬆快活許多。

除了飲料店，有很多生活中常見的場景、應用，也都滿適合教學：

## 案例題目：

1. 訂便當、訂下午茶、團購單
2. 電商網站（購物車、金流、電子發票）
3. 無名小站、YouTube（上傳照片、影片）

其他還有一些比較老的題目像是

1. 留言板、部落格，可練習資料庫操作、動線、版面構成
2. 討論區，練習資料分類與關聯、註冊登入機制
3. 做一個 Twitter，練習建立訂閱功能、newsfeed

## 最後想請教曾經想學習程式語言的朋友

我知道有些朋友想學寫程式，有人為了轉職、為了創業、為了成為更好的 PM 或更好的設計師，也有人是想要更理解工程師，增加跟工程師溝通的效率，但也聽過某些朋友總不得其門而入，想請教有經驗的朋友以下幾個問題：

1. （動機）過去是否曾經想要學習寫程式但卻不得其門而入，一開始是為什麼想學寫程式？
2. （遇到的困難）學到一半遇到什麼困難才沒能學成？
3. （想要怎麼學）如果調整為情境個案式的教學，會不會增加學習動力？
4. 或是直接跟我說想做的題目，我來練習寫教材 🐯

#朕喝的茶
#朕喝了茶不尖叫
#我沒有要開飲料店
#清朝康熙雍正乾隆都愛喝茶
#像是碧螺春就是康熙喝了喜歡特別取的名字
#敏捷寫作

免費！免費！2135 頁的「網頁程式設計」電子書免費下載贈送！（英文資源）

下載網址：https://goo.gl/Gf4MkX

今天要推薦給想學「網頁程式設計」的朋友一份免費下載的電子書！厚達 2135 頁！內容包括：

1. HTML：網頁前台必學標籤語言
2. PHP：網頁後台很流行的流程 & 資料庫存取語言
3. MySQL：網頁世界用最多的資料庫
4. JavaScript：網頁前/後台都可以用的重要語言
5. WordPress：架站機！不用寫一列程式碼，20 分鐘內馬上擁有一個自己的部落格！
6. Laravel：PHP 框架語言。把一些「登入」、「資料庫存取」的 PHP 程式碼寫好，讓你用一行取代數十行
7. Object-Oriented Programming：物件導向程式設計！目前最流行的程式設計工法
8. Linux：網路架站最常用的作業系統
9. Virtualization：虛擬化！讓你用一台實體機，架設出好幾台虛擬機

下載方法請先點擊上面的「下載網址」連結。進去之後你會看到價格不是 $0。此時有個小訣竅，只要您把價格的「拉 bar」，向左移動到 $0（如附圖），然後選擇加入購物車，接著結帳就可以了。我自己試過，真的可以不花一毛錢下載到這本 PDF 格式的電子書！

由於不知道這位作者會佛心到何時，所以如果您有可能用到這類書籍，就儘早下載吧！內容很豐富喔！

今天的分享夠「重量級」吧？如果您也覺得不錯，或者您知道哪些朋友也可能需要這本書，就按讚或分享出去讓他們知道吧～ 免費的順水人情是很值得一試的！（笑）在此先祝福各位週末愉快！

這家公司整合兩千多家成衣供應商，打造服飾電商界聯發科！

2017/3/16 精選轉貼

評論

作者 林俊劭 ，前商業周刊主編、資深記者，學生時代就進入商周，十年累積 396 篇文章，其中有 156 篇封面故事。主跑科技線，曾深入採訪美國最大賣鞋網 Zappos、台灣第一個受邀到淘寶總部參訪的記者、率先披露 Lativ 從 0 到 60 億傳奇創業故事。現職為一家大集團旗下健康醫療公司的行銷主管，自由撰稿人、專欄作家。

「你負責貌美如花，我負責賺錢養家！」

這句既霸氣又溫柔的話，原本是中國近年來最夯的告白詞，但在台灣，竟然有家公司把它實現在網紅經濟上，創造了一個全新的商業模式。

「TOPPIX」這個英文字，今年初以來悄悄出現在上百位網紅部落客的 FB 粉絲頁與 IG 上，包含有「華航林依晨」之稱的 Ivy Chao，近 30 萬粉絲的穿搭部落客 荔枝兒 、雙胞胎網紅 大饅大力 等。

點進去一看，網紅身上穿的衣服飾品，售價、尺寸、材質、來源等資訊一應俱全。粉絲若看上了哪件，立刻可以在網頁上下單購買，整個過程不需要一分鐘。選購中若有任何問題，還可以諮詢線上客服。

一時間，這百位網紅如雨後春筍般的開設了選品店，有的甚至推出了自創品牌。背後的系統服務商，就是 TOPPIX。
部落客月入十萬沒問題

擁有一家自己的店，一直是許多女孩的夢想。過去台灣網紅部落客的賺錢之道，不外乎衝高人氣流量，換取廣告代言或寫業配文的機會。以一個擁有 20 萬粉絲數的網紅來說，臉書上撰寫一篇文章的價碼大約在一萬新台幣左右，加上拍攝影片、開直播等，月收入十萬不是問題。

但這就像藝人接通告一樣，不只案源不穩定，且競爭激烈，旺季時案子就算再多產能還是有限，淡季時又收入銳減。如果起家的本錢只是靠顏值，終究得面臨年華老去、後進者搶飯碗等現實。

換跑道當老闆娘卻要過五關斬六將

不少網紅因此興起自己當老闆娘的念頭，尤其以服飾穿搭類，最常見的作法，就是到韓國東大門代購連線或是廣州批發市場批貨。

然而穿得美美拍照是一回事，自己開門做生意完全是另外一回事。首先，光是要找到可靠穩定的貨源就不容易，大多數沒有經驗的網紅，在這一段就會面臨到品質不穩定、商品斷貨、買價過高、產品瑕疵等問題。

再者得具備市場敏銳度與挑貨能力。當年東京著衣之所以能迅速崛起，就是靠創辦人周品均「十款能中七款」的精準眼光。

即便前兩關都順利度過，接踵而來的還有成本控管、下單數量、進出口報關、庫存管理、客戶服務、現金流週轉、公司營運、人事管理等一連串繁瑣的問題。

最讓人扼腕的是，好不容易一款爆紅，一 po 上網就被秒殺，訂單大量湧入，滿心歡喜的想要再回去追加，卻發現上游源頭斷貨，想賣也沒得賣，只好一個個道歉退錢，白費工夫不說，還得賠上銀行手續費、客服人力等成本。

電商開店的系統服務商出現

系統服務商的出現，完全鏟平這些門檻，不只提供一般電商開店平台的基礎服務，如如商品上下架、訂單管理、購物車等，還整合了韓國、廣州兩千多家成衣供應商資源，每個月自動彙整出上千款的服飾目錄，供網紅們挑選。

網紅不用自己拿錢出來進貨，不用背負龐大的庫存壓力，沒有現金週轉不過來的風險，更不需要飛到當地跟工廠下單，唯一要做的，就是自己原本最擅長的事：選款或設計、穿搭、拍照、上傳。所有做服裝品牌的繁瑣細節，通通由系統服務商搞定。

更猛的是，想要自創品牌也沒問題。除了成衣廠外，系統服務商背後還有兩百多家具備高機動性與快速反應能力的代工廠，從布料挑選、版型設計到打樣，整套流程都能交給它處理。

若網紅本身擁有高人氣，但對自創品牌沒有經驗，系統服務商還提供品牌顧問，協助網紅找出符合其品牌定位的商品結構。待上架開賣之後，它還能從後台抓取數據，分析各個單品銷售好壞的原因，替網紅擬定下一波的銷售策略。

換句話說，系統服務商就像是服飾電商界的聯發科，提供所有想開店的網紅們一套全方位解決方案。每成交一筆生意，雙方就有一定比例的抽成分潤，真正做到網紅經濟的最後一端，把高流量變現金。

網紅最懂網紅

這個商業模式的幕後推手，是網路知名服飾品牌 I’MIUSA 創辦人林佳語。輔大織品系畢業，大學時期就到五分埔批貨。擁有模特兒外表與身材的她，2003 年踏進網拍的世界，很快就打出名號，與東京著衣幾乎同時期崛起。

在那個電子商務剛萌芽的年代，她光靠批貨，第一年營收就做到一千萬；而後在敦化南路開設第一家實體店面，帶動網拍賣家紛紛進駐，形成「網拍一條街」的群聚效應。極盛時期，她的年營收達三億新台幣。

批貨批了四、五年，競爭開始激烈，一款新貨上架熱賣，沒兩天就出現更便宜的售價，市場淪為殺價紅海。林佳語開始跨足設計，走自有品牌之路，三年間跑遍上百家台灣、大陸等地的代工廠，並透過淘寶進入中國市場。

然而轉型的速度，跟不上環境的變化，當時公司又爆發合夥人的誠信問題，心灰意冷下，將一手建立的品牌賣給阿瘦集團相關企業，她自己則轉型做品牌顧問，協助許多網路賣家建立自有品牌。

林佳語沒有想到，這個轉換，竟然成了她日後創出系統服務商的基礎。品牌顧問的經歷，讓她熟知一般人開店或是新創品牌時的痛點；而十多年服裝設計生產、跑工廠、做品牌的實戰歷練，更讓她累積了足夠的業界資源與人脈。

當年 I’MIUSA 在中國生產商品時就已經有品質控管的概念，早在中國當地設有品檢部。「我把以前這些員工找回來，每天蒐集當地檔口（批發商）最新的資料傳回來台灣總部，作為系統服務商的資料庫，列出款式、規格、設計、成本，給客戶來挑選，」林佳語說。她有一組人駐點廣州批發中心，另一組人在韓國東大門，隨時能掌握兩千多家批發商訊息。

有趣的是，系統服務商採取邀請制，不是任何「網紅」都能使用這套服務系統。「我一定要篩選過，合作對象一定要有想法有才華又肯努力，不能說你不努力我還投入大量資金資源時間輔助你，」林佳語說。

若網紅空有高人氣，卻不願意付出努力，那就不具備開店做品牌的資格。「我曾經遇到過有部落客因為天氣冷就不想出門拍春裝，每天連要發什麼文章想法都沒有，這樣怎麼可能創立自有品牌？」因此，一開始的百位網紅，未來將精選至四十多位。

系統服務商的商業模式在中國已經開始發展

但這樣的商業模式是否真的可行？把眼光投向中國，或許可以找到答案。

擁有「中國第一網紅」之稱的張大奕，2016 年也成立了自有品牌電商，光是上半年的營收就將近四千萬人民幣。其背後的系統服務商「如涵控股」，發展過程與 Toppix 幾乎如出一轍，同樣是整合了成衣上下游供應鏈，旗下網紅在微博上的粉絲總數超過一百五十萬。今年初，如涵剛獲得阿里巴巴三億人民幣的投資，顯示就連馬雲都看好它的未來發展。

看來，「網紅+電商」、「流量=現金」這樣的方程式，將會再掀起新一波網路創業風。

資料來源：https://www.inside.com.tw/2017/03/16/toppix

Python程式入門與Django架站第2次範例BMI增加對應的圖片與CSS與樣板與表單

上課內容：
01_重點回顧與範例hello1到hello4
02_將年齡範例改為Django網頁互動版本之一
03_將年齡範例改為Django網頁互動版本之二
04_用GET傳遞兩個以上的參數
05_練習題BMI練習改為DJANGO版本說明
06_練習題BMI練習改為DJANGO版本實作
07_BMI增加對應的圖片之一
08_BMI增加對應的圖片之二
09_BMI增加CSS與樣板之一
10_BMI增加CSS與樣板之二
11_增加表單計算結果
12_增加BMI表單結果說明
13_預告下周其他練習題

完整教學
http://goo.gl/aQTMFS

吳老師教學論壇
http://www.tqc.idv.tw/

教學論壇(之後課程會放論壇上課學員請自行加入)：
https://groups.google.com/forum/#!forum/ncu_python_2019

懶人包：
EXCEL函數與VBA http://terry28853669.pixnet.net/blog/category/list/1384521
EXCEL VBA自動化教學 http://terry28853669.pixnet.net/blog/category/list/1384524

建置Python與Django開發環境
基本語法與結構控制
迴圈、資料結構及函式
建立專案及app與檔案處理
視圖與模版
資料庫及後台管理
資料查詢與新增功能實作
資料刪除和修改功能實作
專題：新聞公告系統、網站留言版、網路相簿、購物車、美食地圖
部署網站

參考書目
Python架站特訓班：Django最強實戰作者： 鄧文淵/總監製, 文淵閣工作室/編著?出版社：

碁峰?出版日期：2017/08/31

吳老師 108/5/10

Python,Django,中央大學資工系,福建師範大學,程式設計,線上教學,PYTHON安裝環境,網路爬蟲

Python程式入門與Django架站第2次範例BMI增加對應的圖片與CSS與樣板與表單

上課內容：
01_重點回顧與範例hello1到hello4
02_將年齡範例改為Django網頁互動版本之一
03_將年齡範例改為Django網頁互動版本之二
04_用GET傳遞兩個以上的參數
05_練習題BMI練習改為DJANGO版本說明
06_練習題BMI練習改為DJANGO版本實作
07_BMI增加對應的圖片之一
08_BMI增加對應的圖片之二
09_BMI增加CSS與樣板之一
10_BMI增加CSS與樣板之二
11_增加表單計算結果
12_增加BMI表單結果說明
13_預告下周其他練習題

完整教學
http://goo.gl/aQTMFS

吳老師教學論壇
http://www.tqc.idv.tw/

教學論壇(之後課程會放論壇上課學員請自行加入)：
https://groups.google.com/forum/#!forum/ncu_python_2019

懶人包：
EXCEL函數與VBA http://terry28853669.pixnet.net/blog/category/list/1384521
EXCEL VBA自動化教學 http://terry28853669.pixnet.net/blog/category/list/1384524

建置Python與Django開發環境
基本語法與結構控制
迴圈、資料結構及函式
建立專案及app與檔案處理
視圖與模版
資料庫及後台管理
資料查詢與新增功能實作
資料刪除和修改功能實作
專題：新聞公告系統、網站留言版、網路相簿、購物車、美食地圖
部署網站

參考書目
Python架站特訓班：Django最強實戰作者： 鄧文淵/總監製, 文淵閣工作室/編著?出版社：

碁峰?出版日期：2017/08/31

吳老師 108/5/10

Python,Django,中央大學資工系,福建師範大學,程式設計,線上教學,PYTHON安裝環境,網路爬蟲

Python程式入門與Django架站第2次範例BMI增加對應的圖片與CSS與樣板與表單

上課內容：
01_重點回顧與範例hello1到hello4
02_將年齡範例改為Django網頁互動版本之一
03_將年齡範例改為Django網頁互動版本之二
04_用GET傳遞兩個以上的參數
05_練習題BMI練習改為DJANGO版本說明
06_練習題BMI練習改為DJANGO版本實作
07_BMI增加對應的圖片之一
08_BMI增加對應的圖片之二
09_BMI增加CSS與樣板之一
10_BMI增加CSS與樣板之二
11_增加表單計算結果
12_增加BMI表單結果說明
13_預告下周其他練習題

完整教學
http://goo.gl/aQTMFS

吳老師教學論壇
http://www.tqc.idv.tw/

教學論壇(之後課程會放論壇上課學員請自行加入)：
https://groups.google.com/forum/#!forum/ncu_python_2019

懶人包：
EXCEL函數與VBA http://terry28853669.pixnet.net/blog/category/list/1384521
EXCEL VBA自動化教學 http://terry28853669.pixnet.net/blog/category/list/1384524

建置Python與Django開發環境
基本語法與結構控制
迴圈、資料結構及函式
建立專案及app與檔案處理
視圖與模版
資料庫及後台管理
資料查詢與新增功能實作
資料刪除和修改功能實作
專題：新聞公告系統、網站留言版、網路相簿、購物車、美食地圖
部署網站

參考書目
Python架站特訓班：Django最強實戰作者： 鄧文淵/總監製, 文淵閣工作室/編著?出版社：

碁峰?出版日期：2017/08/31

吳老師 108/5/10

Python,Django,中央大學資工系,福建師範大學,程式設計,線上教學,PYTHON安裝環境,網路爬蟲