布萊恩的創業小窩的部落格

 
你還在RWD還是AWD間做選擇嗎?看完這篇你或許就有答案了!

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 
繪圖用人工智慧發展到「你說我畫」的境界！透過 NVIDIA 於上個月發表的最新版 GauGAN2（點此繪圖），你只要輸入「海灘的日落」 (sunset at a beach) 等短句，人工智慧即可自動生成精細的日落海灘圖像！若你覺得還不夠，沒關係！你還可以進一步加入更精確的敘述句如「沿岸的日落」 (sunset at a rocky beach)，或是將「夕陽」換成「下午」、「雨天」等字詞，都能讓 GauGAN2 立即調整生成圖像。

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

AI自殺艙會帶來哪些影響？技術、倫理、法律界各持不同觀點
尼奇克會把石棺計畫印在自行創辦的非營利組織「解脫國際」（Exit International）發行的刊物中，並免費提供，只要年滿 50 歲就可取得設計圖、自行用 3D 列印出該自殺機器，如此輕易就可取得「死亡門票」的方式，各界如何看待？

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

當醫療用人工智慧助人恢復健康時⋯⋯這位醫生卻開發自殺用AI！
截至目前，許多醫療界與 AI 工程師聯手推出各式各樣的人工智慧應用，目的都是為了要救活病人、降低死亡率，像是日前獲 FDA 批准的內視鏡 AI ，可及早預防與醫治大腸癌、還有 PTT 創辦人杜奕瑾因逝母遺憾，而打造的人工智慧敗血症即時預測 AI。 當眾多醫用 AI 在為人類解決問題時⋯⋯有「死亡醫師」之稱的澳洲醫師尼奇克（Philip Nitschke）卻反其道而行，開發了讓人工智能「鑑定」用戶是否該安樂死，並搭配可自行 3D 列印的輔助自殺（assisted suicides）裝置——「石棺（Sarco）」，介紹如以下影片所示：

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 
 
 
 
 
 
 
想重頭開始認識JavaScript,這篇絕對不能錯過!
 
JavaScript 與 Java 有關係嗎？JavaScript 的編年史
1992：ScripEase
一家稱作 Nombas 的公司開發嵌入式語言「Cmm」，後改名為「ScripEase」。之後出現可以嵌入在網頁的 CEnvi 版本
1995：從 LiveScript 改名為 JavaScript
Netscape (網景公司) 與昇陽科技聯手完成 Netscape Navigator 2.0 的腳本語言
「LiveScript」。之後因為「趕流行」而改名為「JavaScript」：因為當時網景公司與昇陽科技組成的開發聯盟為了讓這門語言搭上當時正夯的 Java 程式語言這個「熱詞」，因此臨時將 LiveScript 改名為 JavaScript，但這也成為日後大眾對這門語言有諸多誤解（如誤以為這門語言與 Java 有關）的原因之一。
1996：制定統一 JavaScript 標準
微軟在 IE 3.0 內發布 「JScript」，是為 JavaScript 的複製版。此時有三種版本的 JavaScript，一為 Netscapt Navigator 3.0 中的 JavaScript「本尊」、IE 中的 JScript 與前述 Nombas CEnvi 中的 ScriptEase。同年 11 月，Netscape 決定將 JavaScript 提交給歐洲電腦製造商協會（ECMA）制定統一的 JavaScript 標準。
1997：發布第一版 ECMA-262
ECMA 發布 262 號標准文件（ECMA-262）的第一版，規定了瀏覽器腳本語言的標準，並將這種語言稱為「ECMAScript」（因為當時只有 Netscape 才能合法的使用「JavaScript」這個名字）。
2009：Node.js 讓 JavaScript 朝後端發展
CommonJS 規範讓 JavaScript 朝伺服器端發展。Node.js 就是遵循 CommonJS 規範，可以直接使用 Sockets API 建立各種網路服務程式。
現狀
多虧了 Node.js，讓原本只能應用在前端（瀏覽器端）的 JavaScript 現在也可以可應用在後端（伺服器端）。
JavaScript 有哪些特色？
- 可用任何編輯器開發
- 腳本不需要編譯，直接由 JavaScript 引擎「解釋（註：編輯一行就執行一行）」執行
- 靈活的「弱型別語言」：變數可被賦予不同資料類型的值。
  強型別的語言遇到函式引數型別和實際叫用型別不合的情況，經常會直接出錯或編譯失敗；而弱型別的語言常常靈活地進行隱式轉換因應。
- 基於原型(Prototype-Based)的物件導向語言
- 可跨平台使用：Linux、Windows、MacOS、Android 等
不只是網頁開發：JavaScript 的應用
- 前端（瀏覽器端）的網頁互動效果
- APP 開發
- 圖像使用者介面 (GUI)
- 2D 繪圖、3D 建模（如 Three.js）
- 網頁上實現虛擬實境（VR）與擴增實境（AR)
- 創建網頁伺服器、操作資料庫等後端操作
JavaScript 的開發環境
- 任何瀏覽器（IE、Google Chrome、Firefox、Safari、Opera 等）都自帶 JavaScript
- APP 開發
- 如何建置 JavaScript 的開發環境
1. 瀏覽器端：自帶 JavaScript 解釋器，不需另外建置開發環境。
2.伺服器端：至 Node.js 下載 Node.js 後，使用終端機（iOS) 或是命令提示字元（Windows）輸入「node -v」查看電腦上 Node.js 的版本已確認是否安裝。
 
今天的 JavaScript：熱門程式語言榜冠軍常客
根據 RedMonk 發表 2020 年第 3 季的熱門語言程式排名，儘管第二名 Python 之後的語言排行仍有變動之外，JavaScript 始終蟬聯冠軍寶座。有興趣可參考下列文章：

推薦閱讀：

RedMonk 2020 第三季程式語言排名：JavaScript 仍是冠軍、Python 首度把 Java 踢出前兩名外！

而 RedMonk 熱門程式語言排行榜是結合 GitHub 及 Stack Overflow 平台而綜合出的排名結果：GitHub 能反映程式語言實際被使用的狀況；而 Stack Overflow 則顯示程式語言的討論熱度。RedMonk 綜合以上兩者，歸納出排行，可作為未來程式語言趨勢的參考。
 
 
 
延伸閱讀：


語言大師和數學天才,哪個才是Python課程的佼佼者呢?(上)


靠著AR,狗狗們跑得再遠都能準確接受訓練啦~
Nils Nilsson逝世,讓我們來細數他對人工智慧的貢獻




Python與R語言之戰鹿死誰手?盤點5個即將消失的程式語言!


Google 在 Search Console 中啟用新的檢索統計報告


Google 12 月更新演算法！SEO今年排名最大洗牌
用說的就能寫程式！人工智慧替手傷工程師開發語音程式工具

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 
前端工程師的浮動屬性很難學嗎?它的使用時機和參數又是什麼?今天就來細細說~
 
CSS 的 float (浮動) 屬性
CSS 的 float (浮動) 屬性，是前端工程師在做網頁排版時，必用的基本語法之一。使用 CSS float 浮動屬性，可將一個元素往左移或是往右移，並允許其他元素圍繞它（例如文繞圖、圖繞文等）。
 
何時使用？－float 浮動屬性的使用時機
使用 <div> 等區塊元素排版時，預設的排列方式都是由左至右、由上至下。但若想要讓多個區塊並排、或是二欄、三欄等多欄網頁前端排版時，就需要使用 float 屬性。
如下方例子，若我們使用一般的 div 區塊元素時，則所有的區塊就整齊的由左上出來，一個 <div> 區塊就佔用了一行。（溫馨提示：可以點擊下例視窗左上方的「HTML」與「CSS」按鈕來查看語法）
See the Pen Float-example-1 by Tedutw (@Tedutw) on CodePen.
承上例，若在 CSS 中加一個「float: left;」，則結果如下（溫馨提示：可以點擊下例視窗左上方的「HTML 」與「CSS」按鈕來查看語法）：
See the Pen Float-example-2 by Tedutw (@Tedutw) on CodePen.
這是因為「float」屬性使 div 區塊元素「漂浮」起來，不再形成 div 區塊占滿整行的情況
承上例，若把由左側開始「漂浮」的「float: left;」改成由右側開始「漂浮」的「float: right;」，則所有的區塊就會由右側開始「飄」出來，結果如下（溫馨提示：可以點擊下例視窗左上方的「HTML」與「CSS」按鈕來查看語法）：
See the Pen Float-example-3 by Tedutw (@Tedutw) on CodePen.
你知道 CSS 的浮動屬性總共有三個參數嗎？分別是：left、right 與 none。left 與 right 顧名思義，就是控制區塊由左側還是右側浮出用的拉！如上方兩個例子所示。而 none 就是不使用浮動參數的意思。
下方是另一個文繞圖排版的例子，就是文字的部分「不」設定 float 屬性，但是在 logo 圖片的部分使用浮動屬性「float:right;」，文字的部分則不使用浮動屬性。（溫馨提示：可以點擊下例視窗左上方的「HTML」與「CSS」按鈕來查看語法）
See the Pen Float-example-4 by Tedutw (@Tedutw) on CodePen.
若前端工程師想要做出兩欄或多欄的網頁，則可以善用 float 屬性搭配寬度需要進行初步的排版。
以下範例為兩欄的排版示例。兩個欄位視為兩個區塊， float 屬性都設定為「left」，左欄寬度為 20%；右欄為 80%：
See the Pen Float-example-5 by Tedutw (@Tedutw) on CodePen.
網路上有人說：前端工程師的網頁 layout 基石除了本章介紹的浮動（float） 屬性之外，還有下一張會介紹的清除浮動（clear）。想當前端工程師的各位同學們請先把本章再複習一次，並親自使用 codepen 自己練習一次程式，才會達到最佳的學習效果！
 
相關閱讀推薦：

前端工程師的CSS入門手冊-定位元素

零基礎的也不要怕學習網站前端技能,這篇讓你更了解它!


前端工程師入門撇步獨家分享(22)數學物件

AI人工智慧救地球！Google：AI 保護環境還比人類快 3000 倍


CSS教學-display與visible屬性介紹


用Python寫出唐鳳「番茄鐘工作法」程式，讓AI幫你集中注意力!
AI機器狗Aibo成最新愛寵 真狗會被取代嗎？

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 
 

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

關於網頁前端CSS中的排版屬性,今天要介紹兩種給你認識!
 
本篇介紹網頁前端排版的兩個 CSS 屬性：display 屬性與 visibility 屬性。
CSS：display 屬性
display:block
 
對於 CSS 語法來說，網頁前端的每個元素都是一個矩形盒（rectangular box）模型。而使用「display」屬性，便可以決定「盒（box）」的呈現方式。
又「區塊元素（block element）」則會佔用可用寬度的最大值，前後有換行符。
以下範例分別顯示了是否有將<span>元素顯示為區塊元素（block element）的結果。
在下方的顯示視窗中，按「CSS」，就可以觀看 CSS 的語法如何設定了！
See the Pen display: block by Tedutw (@Tedutw) on CodePen.
上述範例的網頁前端 CSS 語法設定如下：
span.block{
display:block;
}
display:inline
inline 元素只佔用可用寬度的最大值，並不強制換行。
將上一段範例的<span>元素，CSS 換成「display: inline」的結果如下。跟上一個範例一樣，在下方的顯示視窗中，按「CSS」可以觀看 CSS 的語法如何設定。
See the Pen display: block by Tedutw (@Tedutw) on CodePen.
上述範例的 CSS 語法設定如下：
span{
display:inline;
}
display:none
「display:none」用來將元素隱藏使用，當元素隱藏後，就不佔用任何空間了，且在網頁前端頁面顯示時也不會被展現出來，就好像該元素不存在一樣。
 
在以下範例中，我們將第 2、4 段設為「display:none」，其他設為「display:block」。
See the Pen display: none by Tedutw (@Tedutw) on CodePen.
上述介紹的「block」、「inline」、「none」都是最常碰到的的 display 參數。display 當然還有很多其他次常用的參數值，如 list-item、table、table-cell、table-column、grid 等，將會在往後的章節中一一介紹
 
CSS：visibility 屬性
visibility 屬性用於指定元素是可見的還是隱藏的。最常見的值是 visible 和 hidden
當我們想要隱藏園素食，有兩個方法：一是上一段介紹的，將「display」屬性設為「 none」參數；二是將「visibility」屬性設置為「hidden」來隱藏元素。
注意：以上兩個方法雖然都能將元素隱藏，但都呈現出不同的結果：
被「display:none」隱藏後的元素，就不會佔用任何的空間，就好像它從來都不存在一樣；而被「visibility:hidden」隱藏後的元素，雖然在網頁前端不會顯示，但仍佔用了對應的空間（就是被隱藏的元素有多大，網頁上空出來的空間就有多大），所以仍會影響排版。範例如下：
我們準備要將以下的例子，第一個<p>元素設為「visibility:hidden」、第二個<p>元素設為「display: none」。
See the Pen visible:hidden-before by Tedutw (@Tedutw) on CodePen.
將以上的第一個<p>元素設為「visibility:hidden」、第二個<p>元素設為「display: none」的結果如下：
See the Pen visible:hidden-after by Tedutw (@Tedutw) on CodePen.
由以上例子我們可知，同樣都是將元素隱藏，第一個<p>元素雖然被「visibility:hidden」隱藏了，但是仍遺留下空間；第二個被「display: none」隱藏的<p>元素則是完完整整的「被消失」，連原本的位置都不見了。
下一張我們將介紹網頁前端排版的另一個 CSS 屬性：Positioning Elements。
 
相關閱讀推薦：

用Python寫出唐鳳「番茄鐘工作法」程式，讓AI幫你集中注意力!


AI機器狗Aibo成最新愛寵 真狗會被取代嗎？
今年10月即將入手的新身分證，它的UI設計有啥亮點？

你是我的眼！Google AI 眼鏡助視障朋友「看見」世界



懂JavaScript,網頁前端開發之路就輕鬆點啦~
 


零基礎的也不要怕學習網站前端技能,這篇讓你更了解它!
不只前端工程師,還有後端跟全端!!!???


 
 
 

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()

 
前端工程師還不會數學物件嗎?用這篇來好好入門一下!
 
Math物件的屬性
Math 是 JavaScript 的原生物件，可進行多種數學運算。該物件不是用函式建構式來生成，所有的屬性和方法都必須在 Math 物件上呼叫。
Math 物件包含多種屬性，列舉如下表：
 

1. 屬性


2. 描述

1. Ｅ


2. 歐拉常數，是自然對數函數的底數，約為 2.718。

1. LN2


2. 2 的自然對數

1. LN10


2. 10 的自然對數

1. LOG2E


2. 以 2 為底的歐拉常數（Ｅ），其值約為 1.442。

1. LOG10E


2. 以 10 為底的歐拉常數（Ｅ），其值約為 0.434。

1. PI


2. 圓周率，其值約為 3.14159

1. SQRT2


2. 2 的平方根，其值約為 2.414

1. SQRT1_2


2. 1/2 的平方根，其值約為 0.707

 
以上 Math 物件的屬性，範例如下：
See the Pen The Math object by Tedutw (@Tedutw) on CodePen.
Math物件的方法
Math 物件除了有許多屬性外，也有許多方法，列表如下：
 

1. 方法


2. 描述

1. abs(x)


2. 不用懷疑，就是回傳x的絕對值

1. acos(x)


2. 回傳x的反餘弦(三角函數，數學符號是arccos)

1. asin(x)


2. 回傳x的反正弦(反三角函數，數學符號是arcsin)

1. atan(x)


2. 回傳x的反正切(反三角函數，數學符號是arctan)

1. ceil(x)


2. 回傳離x最近的整數：若x為浮點數則向上取整數；x為整數擇取x本身

1. cos(x)


2. 回傳x的餘弦(三角函數，數學符號是cos)

1. exp(x)


2. 回傳值為以x指數的E

1. floor(x)


2. 回傳離x最近的整數：若x為浮點數則向下取整數；x為整數擇取x本身

1. log(x)


2. 回傳x的自然對數

1. max(x,y,z...,n)


2. 回傳最大值

1. min(x,y,z...,n)


2. 回傳最小值

1. pow(x,y)


2. 回傳值為x的y次方

1. random()


2. 隨機回傳0與1之間的任一數

1. sin(x)


2. 回傳x的正弦(三角函數，數學符號是sin)

1. sqrt(x)


2. 回傳值為x的平方根

1. tan(x)


2. 回傳x的正切(三角函數，數學符號是tan)

 
以上 Math 物件的方法，範例如下（不包含三角函數）：
See the Pen The Math object-method by Tedutw (@Tedutw) on CodePen.
除了給前端工程師，其他人也可以嘗試的綜合練習！
讓我們來撰寫一個 JavaScript 程式：首先彈出一個視窗，要求使用者輸入數字。使用者輸入數字後，即會出現警示視窗，顯示著該數字的平方根。
var x = prompt("請輸入一個數字","");
var answer = Math.sqrt(x);
alert(x+" 的平方根是 "+ answer);
執行結果如下：
此時我們輸入「64」，則會有以下結果：
 
JavaScript 的數學物件就介紹到此。若前端工程師能在HTML中善用數學物件，則可減省時間，根本不必自己寫函數啦！
下一章我們將介紹另一個 JavaScript 的原生物件——日期物件。
 
 
相關閱讀推薦：

JavaScript初學者該知道的事(21)陣列的方法與屬性


通往Java的康莊大道~(1)先來了解它身世之謎!
還不曉得JavaScript有多強大?看完這篇馬上被說服!

人生是自己的, 達內教育評價要靠自己來體驗!

痛失英才！台灣人工智慧學校執行長陳昇瑋辭世

用Python寫出唐鳳「番茄鐘工作法」程式，讓AI幫你集中注意力!

達內教育評價:別再抱怨不景氣了!高中生靠SEM接案創業每月額外收入7萬

(繼續閱讀...)

布萊恩的創業小窩 發表在 痞客邦 留言(0) 人氣()