在兩個月內，從開始學習代碼，到發布一個 Web App

01-25

作者：Andrey Azimov

原文：I learned to code, build a web app and launch it on Product Hunt in 2 months

譯者：Garrik

未經授權不得轉載

兩個月以前我開始踏上了我的 Web App 製作之旅。它是一個非常基礎的網頁應用叫做 When To Surf。這是一款面向衝浪愛好者的APP，通過它你能夠查詢每天最佳的衝浪時間。從今天起，這款應用正式上線了。

我是Andrey

我來自烏克蘭，為Railsware遠程工作。像很多在科技公司工作的人們一樣，我夢想著擁有一款能夠每天被人們所使用，屬於我自己的熱門應用。我一直夢想著有一天我能夠親手實現這個願望。

現有問題

目前，我一直居住在在巴厘島，為公司遠程工作。恰巧巴厘島是一個世界上最負盛名的衝浪聖地。在這裡，我開始接觸衝浪。但當我想通過些現有的衝浪預測應用去獲得一些幫助的時候，我發現我很難去理解它們所提供給我的數據，例如Magic Seaweed，這款應用提供給我的大量的，像潮汐，膨脹，周期，風速，方向等等這樣的數據。

這款應用提供了整整十頁內容去指導用戶如何去理解並且應用這些數據。的確，大量的數據可以提供給用戶更多的參考，但是如果大多數人都無法理解它們，那麼對於用戶來說這款應用實在是缺乏可用性。

我想要是我能夠把這些原始數據用代碼進行分析，由此來提升數據的可用性，這樣會不會更好呢？

我很想去實現這個想法，但是我清楚這對我來說實在是有點困難。因為我從來沒有正式的寫過代碼。而且我也完全不知道從何開始。我更加沒有錢去僱傭一個團隊來為我製作這款應用。沒有任何選擇餘地的我，只能先把這個計劃暫時擱置一旁啦。

Pieter Levels

幾個月之後，在Dojo, 這是一個在巴厘島的眾創空間，我遇到了Peter Levels, 他計劃在十二個月內創立十二家創業公司並上線一個名叫 Nomad List 的網站。他的行動大大地鼓舞了，我準備去嘗試實現我之前的計劃，他還建議我去看一下這個視頻。

他認為：

你需要解決你自己實際遇到的問題
請遠離那些創業講座
請用搜索引擎去學習寫代碼
請遠離課程，教材，培訓機構
請做現在你自己技術允許範圍內的事情(e.g. 不要去浪費時間學那些對於你來說太難的新東西)
一定要靠自己去做

按照他的這些理念，我準備嘗試寫代碼並且做出自己的應用。我並沒有準備去做一個技術大牛，能夠用代碼實現我的想法就已經足夠了。

開始吧

在2016年11月3號，我在Namecheap（騰訊雲，阿里雲，百度雲）花$6買了whentosurf.co這個域名。僅僅是買了一個域名，這個小小的第一步就已經開始讓我激動不已了。

之後我在atspace.com上面找到了免費的主機，並且把我的第一個「Hello World」 HTML頁面上傳了上去。

之後我開始去想我可以在哪裡得到我需要的數據呢？我在Google上面搜索天氣APIs，之後我找到了World Weather API. 它提供兩個月的免費使用時間，我可以在上面找到一切我想要的數據。

對於代碼我可以說是個徹底的新手。我開始嘗試那些我以前聽說過的代碼語言。

我的第一個計劃非常簡單：從API上得到數據然後列印在我的HTML頁面上。我想這應該非常容易。我還想通過改變一行代碼去測試是否這些數據能夠快速應用。在沒有應用任何框架，伺服器，編譯的情況下這應該也不會很難。不像那些大公司每天只改幾行代碼，做事縝密。我需要的是快速開發。

前進，前進，前進

我嘗試著打下了人生中第一行JavaScript 。對於很多新手來說，只用一個瀏覽器就能編譯你的代碼是很讓人欣慰的。但是對於我，我還是要說Javascrip並不簡單。尤其是非同步回調函數更是讓我難以理解。

var getJSON = function(url, callback) { var xhr = new XMLHttpRequest();

天哪，太難了

Python

之後我想到Python，它的代碼有很好的可讀性，但是我需要去安裝Django框架，並且需要為它設置一個伺服器。所有的這一切就只是為了運行代碼！我毅然決然的跳過了Python.

PHP

我又嘗試了PHP，我知道很多人並不喜歡PHP，你需要Ruby, Node, React等等。但是我並不在乎。因為它的學習成本是最低的對我來說。 PHP在我的MacOs和瀏覽器里已經預安裝好了。我不用再費額外力氣了。

在幾分鐘之內，我調用了我的第一個API並且得到了數據。

下面就是我最開始的代碼：

$url=』http://api.worldweatheronline.com/premium/v1/marine.ashx?key=2a5fc1776e234e14a7e172153160312&q=-8.659263,115.130158&format=json&tide=yes&tp=1&date=;$json = file_get_contents($url);$data = json_decode($json);$swell_period = $data->data->weather[0]->hourly[0]->swellPeriod_secs;

在一夜之間我做出了我的第一個Web應用：

幾天之後，我在網上找到了一些設計樣式，並且做出了新的界面：

我真的很驕傲

No git

與此同時，我身邊的很多人開始建議我用GitHub, 不要再用FTP上傳文件了。

但是我真的不喜歡每次像這樣用git

git addgit commit -m "Bla Bla Commment"git push origin master

相反的，我只是創建一個文件夾，然後備份昨天的數據。雖然我不用git。但是我還是有我自己基本的版本控制系統。

設置我的Web伺服器

我的免費主機確實是有點太破了。幾周之後，它就開始不好好運行了，大家開始建議我部署自己的VPS。

沒多久，主機正式罷工了。我真的慌了，我必須趕緊解決這些問題。我在DigitalOcean（騰訊雲，阿里雲，百度雲）花了$5，按照他們的教程一步一步的搭建。

幸好我在眾創空間遇到了Oskar，一個瑞士小夥子，當我在VPS上遇到問題的時候他幫了我很多。

搬到HTTPS

這個小障礙沒能阻止我前進。我現在需要從瀏覽器獲得用戶的定位。我想用JavaScript去實現它。但是Chrome只允許擁有HTTPS認證的站點去使用定位功能。所以要想做到這一點我開始學習部署Lets Encrypt。這個東西這的非常難，但是我還是再一次按照教程一步一步的實現了它。很快我的站點搬到了HTTPS：

已經半程了

一個月之後，我的代碼開始變得越來越臃腫。但是通過我的那些胡亂注釋，我還是清楚每一段代碼都是在做什麼的。

獲得用戶回饋

來自Lean Sartup的Eric Ries建議我儘早去獲悉用戶的使用感受。

另一個我在眾創空間遇到的人Marc，建議我把應用運行到Ipad上，並和一個意見箱一起安放在牆上。這個建議很合理，因為在這裡40%的人都是衝浪愛好者（從沙灘到Dojo只需要一分鐘）。我的意見箱就像下面這樣：

一天之後，我只獲得了很少的一些意見。很明顯這個方法行不通呀。大家對這個應用並不很感興趣。

絕望黑沼澤

當我最初的熱血開始燃燒殆盡。激情已經不再。這件事開始變得有些痛苦了。我白天要做我的本職工作，晚上還要熬夜去完成這個應用。

我給我的衝浪教練看我的應用，他很快就說這行不通，因為影響最佳衝浪時間的因素實在太多了。

我意識到他可能是對的，因為我還確實沒能成功預測出最佳衝浪時間呢。我的數據不夠廣泛，我的能力也不夠去整合分析這些數據然後得出一個最佳時間。

我的應用現在也只能在巴厘島用，我也沒能讓它足夠可靠到能在世界各地去使用。我希望世界上所有的衝浪愛好者都能打開 http://whentosurf.co 然後立刻獲得和他相關的衝浪信息。

真的，我想要放棄了，因為為什麼我要做一個沒人願意用的應用呢？而且我要怎麼獲得所有的數據來讓我的應用能夠在全世界使用呢？

我的眼睛也發炎了。眼球紅腫，不能夠長時間盯著電腦屏幕。

但我還是滴完眼藥水，繼續打代碼 : )

第二回合

我和我的朋友們談論了這一切，他們告訴我別管那麼多，繼續開發就是了。 Pieter告訴我這個很正常的，而且很多人都是在這裡選擇放棄了，只是因為害怕，而沒能繼續下去。

在那之後的下一周，我開始變得硬核起來，我用一個建立在金錢上的責任分配系統去督促我們完成任務，完成我的衝浪應用。

哪怕最後沒人用我的應用，我也要完成它，我也要讓它最終上線。

從晚上八點到早上六點，我們聽著歌，喝著茶。

最佳時間的公式

如果我想知道怎麼獲得最佳衝浪時間，但我還不會用代碼實現它。我只能去嘗試些別的方法了。我列了一個表格，然後實驗各種公式：

試驗過後，我把它們轉換成代碼

終於差不多了

現在我的應用開始可以為全世界任何一個地方進行評分。即使這個地方並沒有海灘。沒關係，這只是我的第一個版本。至少它現在已經差不多像樣了：

準備上線

終於，第一個基本版本已經正式上線了。這篇博客在這裡也該差不多結束了，因為我才剛剛上線這款應用不是嗎。我會持續更新後續內容的。

我的計劃是：

在Product Hunt上提交這款應用（我不想依靠他人，相反的我想靠應用本身去獲得成功。）

UPD: JUST LAUNCHED: When to Surf - Product Hunt

在網上和社交媒體上與衝浪愛好者小組進行聯繫，和他們分享這款應用，並且獲得回饋，持續改進應用。
在應用底部欄獲得用戶的郵箱，根據他們的定位，我可以持續為他們發送最新的衝浪信息，為了讓他們能夠持續訪問應用。（雖然我還沒有寫這部分代碼）
如果這一切都開始起作用了，提供給新手更好的使用體驗，為能和像Magic Seaweed這樣的大應用進行對抗。

花費的時間 & 金錢

時間：

我用 Toggl記錄下來我所花的時間，大概有118個小時。

金錢：

域名 = $6/年
伺服器 = $5/月
總共：$11

如果我讓一個軟體公司來開發這款應用，我敢肯定他們一定會花 $29,989以上 : )

工具使用

我用了：

Sublime Text Editor - 寫代碼
Namecheap - 域名（騰訊雲，阿里雲，百度雲）
Digital Ocean - VPS （騰訊雲，阿里雲，百度雲）
LetsEncrypt - SSL （騰訊雲，阿里雲，百度雲）
Google Analytics - 檢測流量（百度統計）
Toggl - 記錄用時（時間塊）日常計劃 -（番茄土豆，滴答清單）
大量寫滿日常計劃的便利貼

我的代碼是開源噠

我的代碼在GitHub上是開源的。純硬核，無MVC，全都放在了一個文件里。

我學到了什麼？

解決自己遇到的問題。這樣做更好，因為這些問題是你真的關心的。把找到最佳衝浪時間點作為我的執念，這樣可以讓問題更簡單（但依舊很難）。你是你的第一個用戶！
找那些站在你的目標上的人做你的導師，眾創空間是一個很好的地方，那裡已經有很多人已經做出了成功案例。
通過做而學。別花時間去看教材啦。學會用搜索引擎配合那些你所知道的知識。如果你真的需要一位導師，真正好的是那些不要錢的，因為他們已經成功了，不再需要你的錢了！別去找所謂的創業導師，他們只是想吸走你的錢而已。
別怕新技術。我開始時害怕寫代碼，之後是APIs，設置伺服器，再之後是HTTPS。但是當我真的使用它們的時候，其實這些就是紙老虎而已。
前進，前進，前進！千萬別放棄。不斷地嘗試直到你完成了你的應用。

保持聯繫

這就是我與寫在胳膊上的日常計劃 : )

如果你喜歡我的故事，你可以在Twitter上與我取得聯繫。告訴我你對我的代碼和應用的看法，以及怎麼能讓我的應用變得更好。

謝謝，

Andrey。

聲明：本文已獲得原作者授權，轉載中文譯本請聯繫譯者，轉載原文請聯繫作者。