<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Peter Kan</title>
    <description>The latest articles on DEV Community by Peter Kan (@petervsjim).</description>
    <link>https://dev.to/petervsjim</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F863853%2Fdd6f013c-36f3-4ba3-b64b-82bacb3a96a5.jpg</url>
      <title>DEV Community: Peter Kan</title>
      <link>https://dev.to/petervsjim</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/petervsjim"/>
    <language>en</language>
    <item>
      <title>CSS sizing: rem % vw em px 超簡易使用指南</title>
      <dc:creator>Peter Kan</dc:creator>
      <pubDate>Thu, 11 Aug 2022 03:43:00 +0000</pubDate>
      <link>https://dev.to/petervsjim/css-sizing-rem-vw-em-px-chao-jian-yi-shi-yong-zhi-nan-2ei2</link>
      <guid>https://dev.to/petervsjim/css-sizing-rem-vw-em-px-chao-jian-yi-shi-yong-zhi-nan-2ei2</guid>
      <description>&lt;p&gt;rem: 每個element的font-size, width, height 如果需要指定就用rem，不需要指定就用%，或是auto。&lt;/p&gt;

&lt;p&gt;%: 比例縮放的時候用&lt;/p&gt;

&lt;p&gt;vw: &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;reset css有的會有，請specify你的body為100vw，避免網頁超出去。&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;1200px以上的media query內，把rem換成vw。這樣在電腦可以有完美尺寸的畫面。不過這有點看人用，用rem換size的網頁也大有人在。。。&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;em: 在font-sizing指定的情況下，像是letter-spacing等等的間距的時候用，可以根據你的font-size調整。&lt;/p&gt;

&lt;p&gt;px: 做border、box-shadow等小東西的時候用&lt;/p&gt;

&lt;p&gt;大概4john，請記得基本尺寸一定用rem，除了可以依據user preference自動更動以外，在手機上面也顯示得出來，如果你在1200px下用vw的話，字會超級小。。。&lt;/p&gt;

</description>
    </item>
    <item>
      <title>初學AI一週心得 -- 如何接觸AI、AI的學習資源推薦！</title>
      <dc:creator>Peter Kan</dc:creator>
      <pubDate>Mon, 23 May 2022 06:05:43 +0000</pubDate>
      <link>https://dev.to/petervsjim/chu-xue-ai-zhou-xin-de-ru-he-jie-chu-ai-aide-xue-xi-zi-yuan-tui-jian--i6a</link>
      <guid>https://dev.to/petervsjim/chu-xue-ai-zhou-xin-de-ru-he-jie-chu-ai-aide-xue-xi-zi-yuan-tui-jian--i6a</guid>
      <description>&lt;p&gt;嗨，這篇文章是我自己開始接觸AI的心得，自從接觸到「反脆弱」這本書後，就覺得AI的觀念蠻適合反脆弱的，於是開始接觸、學習AI，到現在差不多一個禮拜，在這邊跟大家分享一個完全不懂AI的人要怎麼接觸AI，以及AI的概念的學習資源。&lt;/p&gt;

&lt;h1&gt;
  
  
  如何接觸AI
&lt;/h1&gt;

&lt;p&gt;要接觸AI的話，首先要先知道自己在學習AI上的定位，究竟是：&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;覺得AI很酷，想了解看看&lt;/li&gt;
&lt;li&gt;有一些事情想做，想改善公司、工作、學習流程&lt;/li&gt;
&lt;li&gt;想快速接觸Tensorflow之類的程式，或者成為AI工程師&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;每個人對於AI都有不一樣的想法，我自己是2，希望可以在AI之中找到跟語言相關的內容。所以我這邊主要著重在AI的概念上，希望可以由淺至深，從概念到實做一步步地理解。下面的兩個推薦課程就包含了AI的概念與應用方式，以及AI的核心技術理論。透過學習這兩個課程，可以讓自己對AI有更好的理解，也可以為將來的各種應用做出變化。&lt;/p&gt;

&lt;p&gt;如果你是1的話，AI for Everyone就蠻適合你的，3blue1brown的有點太細節。&lt;br&gt;
如果你是3的話，說實話，我無法給太多建議，但這兩個課程都偏理論，想要直接上手的話可以直接去找Tensorflow相關的，例如 Deep Learning Specialization。&lt;/p&gt;

&lt;p&gt;由於我自己喜歡從大局著手，下面兩個分享的都是比較廣泛的理論內容，不妨可以參考看看。除此之外，我也推薦可以從各個論壇找關鍵字，例如 AI roadmap，或是how to learn AI，都會得出不錯的結果。&lt;/p&gt;

&lt;h1&gt;
  
  
  推薦的AI學習資源
&lt;/h1&gt;

&lt;p&gt;話不多說，直接介紹要怎麼學AI，關於我自己對AI的理解會放在最後面，我這邊會介紹兩個我這次接觸AI的主要學習資源。&lt;/p&gt;

&lt;h2&gt;
  
  
  關於AI的一切 - AI for Everyone
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://www.deeplearning.ai/program/ai-for-everyone/"&gt;https://www.deeplearning.ai/program/ai-for-everyone/&lt;/a&gt;&lt;br&gt;
推薦程度：★★★★★&lt;br&gt;
難易度：★☆☆☆☆&lt;br&gt;
先備知識：無&lt;br&gt;
時間：4~6 hrs&lt;br&gt;
費用：免費&lt;/p&gt;

&lt;p&gt;這門課是國際知名AI大神 Andrew Ng 吳恩達所製作的AI入門課程，以一個宏觀的角度講解何謂AI，裡面&lt;strong&gt;完全沒有&lt;/strong&gt;要寫程式的地方。&lt;/p&gt;

&lt;p&gt;我自己在看這堂課的時候，有個感覺是Andrew一定是抱持著希望每個找他問AI的人都看過這部影片的心態在製作，不管你是學生、上班族、甚至是公司的經理或老闆都可以從這一系列的影片獲取AI的觀念。&lt;/p&gt;

&lt;p&gt;裡面我覺得特別有價值的地方有兩點：&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;一間公司或一個人要如何從零開始AI&lt;/li&gt;
&lt;li&gt;AI到底是什麼，跟媒體講的有什麼不一樣&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;一般人只要想到AI，就會覺得AI無所不能，而Andrew算是破解了這個迷思，但同時也用很多範例說明了雖然AI並不能通天，但還是可以做到很多事情。同時也講解了我們要怎麼開始AI的幾個步驟，步驟也都在影片裡面詳細的列出來，並附加說明。&lt;/p&gt;

&lt;p&gt;舉例來說好了，Andrew並不建議一間公司一開始找一堆人啟動一個AI的大專案，而是從小地方開始找人，並循序漸進的從小資料開始蒐集，並慢慢往AI公司的方向前進。其中也分析了AI到底是適合自己做，還是適合外包。&lt;/p&gt;

&lt;p&gt;總的來說，這門課雖然沒有講述AI的運作機制，但卻可以讓人知道AI的能與不能，讓往後在進行AI專案的時候有個藍圖可以參考。&lt;/p&gt;

&lt;h2&gt;
  
  
  3blue1brown - Neural Networks系列
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://www.youtube.com/playlist?list=PLZHQObOWTQDNU6R1_67000Dx_ZCJB-3pi"&gt;https://www.youtube.com/playlist?list=PLZHQObOWTQDNU6R1_67000Dx_ZCJB-3pi&lt;/a&gt;&lt;br&gt;
推薦程度：★★★★☆&lt;br&gt;
難易度：★★★☆☆&lt;br&gt;
先備知識：無，但有矩陣的知識會比較好理解&lt;br&gt;
時間：1~2 hrs&lt;br&gt;
費用：免費&lt;/p&gt;

&lt;p&gt;數學、資訊普及界的大神 3blue1brown 想必大家都不陌生，他以圖像化數學知識聞名，可以將生澀難懂的知識以youtube動畫的方式呈現出來。這個系列就是他以動畫方式呈現AI中深度學習的一環 -- 神經網路 Neural Network。&lt;/p&gt;

&lt;p&gt;對於不知道什麼是神經網路的同學，這邊簡單講解就是，在AI的"超能力"中，有一個能力，也是最廣泛被使用的能力就是，可以讓電腦接觸一大堆正確資料，而AI會從那些資料學習出一套方法，讓不知道答案資料透過AI也可以得出結果。其中AI的學習方法中，神經網路是最廣泛使用的概念。&lt;/p&gt;

&lt;p&gt;也就是說，神經網路可以說是AI中最重要的一項概念。&lt;/p&gt;

&lt;p&gt;在這一系列的影片中，3b1b將神經網路以多角度、圖像化的方式呈現，從神經網路的構成，到機器是如何從一次又一次的循環之中"學習"出方法來的，裡面都有做詳細的說明。雖然裡面沒有教你要怎麼一步步地把AI寫出來，但知道這些AI的運作模式後，想必未來在進行專案時能夠更清楚知道軟體的運作模式，而不是純粹地照本宣科。&lt;/p&gt;

&lt;h1&gt;
  
  
  結語
&lt;/h1&gt;

&lt;p&gt;看完這兩門課程，我確實對AI有了更好的理解，如果我是公司的高層的話，我看完這些課程之後我就可以開始想公司如何能夠運用AI，並了解如何與AI工程師溝通。假如你沒有要自己寫程式的話，這樣的AI知識其實就已經足夠應付很多場合了。&lt;/p&gt;

&lt;p&gt;話雖如此，我還會繼續往後走，我的下一步是進行 Andrew Ng 在 deeplearning.ai 上開設的 Deep Learning Specilization。這門課程是2017年開的，今年六月會迎來一波大更新，我打算在六月時再上這門課。屆時再跟大家分享這門課的心得感想。&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Test</title>
      <dc:creator>Peter Kan</dc:creator>
      <pubDate>Tue, 17 May 2022 15:18:18 +0000</pubDate>
      <link>https://dev.to/petervsjim/test-5b19</link>
      <guid>https://dev.to/petervsjim/test-5b19</guid>
      <description>&lt;p&gt;Just getting an idea about how this blog works.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight python"&gt;&lt;code&gt;&lt;span class="n"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s"&gt;'hello world'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;print&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;hello world&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;&amp;lt;p&amp;gt;Hello World&amp;lt;p&amp;gt;&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight html"&gt;&lt;code&gt;&lt;span class="nt"&gt;&amp;lt;p&amp;gt;&lt;/span&gt;Hello World&lt;span class="nt"&gt;&amp;lt;p&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight jsx"&gt;&lt;code&gt;&lt;span class="k"&gt;return&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Hello World&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;This is a quote&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h1&gt;
  
  
  Hello
&lt;/h1&gt;

&lt;h2&gt;
  
  
  World
&lt;/h2&gt;

&lt;h3&gt;
  
  
  hihihi
&lt;/h3&gt;

&lt;p&gt;Regular &lt;strong&gt;Bold&lt;/strong&gt; &lt;em&gt;Italic&lt;/em&gt;&lt;/p&gt;


&lt;p&gt;Hello&lt;/p&gt;


</description>
    </item>
  </channel>
</rss>
