網頁日記

操作完簡單的 Javascript 實作後，馬上來進到下一步 —— 認識重量級函式庫！ 那～ 我們馬上來看看 React.js 能帶給我們哪些便利之處吧～ 本篇日記針對 React 的十大特點做概括性的介紹 希望新手朋友們看完此篇對於 React 就能有最基礎的認識＆了解 ?   1. React 超基本介紹 為 Javascript 的函式庫 用於建造可重複使用、元件化、具互動性的 UI…

恭喜你們看到倒數第二集啦！ 可喜可賀?  相信你學 JS 的目的應該也是想走前端或是做出屬於自己香味的網頁吧～ 那這集就是你發揮所學的地方嘍（摩拳擦掌?  延續上集下拉式選單的精彩製作，這集要來教大家如何最簡單生出看起來好像很厲害的圖片輪播 Carousel！一起練功吧～   使用 Bootstrap 前注意事項： 使用前必須按指示寫入指定 CSS 和 JS 程式碼（如不清楚可回上一篇日記 review） Carousel 功能不會自動化調整輪播畫面尺寸，因此必須另行定義 Carousel default 功能無附加箭頭 (▶) 和指示…

上週實作完徒手刻下拉式選單，這禮拜要來介紹偷吃步 —— 使用現成的 Bootstrap 來製作～ 但也別怪我這麼晚介紹這麼好用的功能，畢竟學習還是要從基本功開始一層一層堆疊上去 首先，你一定會問到：什麼是 Bootstrap 呢？ 根據官網定義，Bootstrap 是一個利於快速製作響應式網站 (responsive web) 和致力於行動優先 (mobile-first) 的框架，它裡面用到的技術不外乎 HTML, CSS 和 Javascript，也就是前幾集介紹過的那些東西。   在做前端的人應該多多少少聽過 RWD (Responsive Web…

前面幾集已差不多把 JS 基本觀念做了一輪概括性的整理，這集我要來和大家示範如何製作最簡易的下拉式選單，也順便驗收＆應用所學觀念，那我們就不囉唆～ Let’s get rolling!   首先，製作最基礎的下拉式選單需要的是簡單的 HTML 和 CSS 觀念，甚至如果你只需要滑鼠游標 hover 到按鈕上就能展開選單的功能，那你根本不需要動用到 JS。今天小白?‍♀️ 我會分享不需要用到 JS 和必需要用到 JS 的下拉式選單版本，對 HTML 和 CSS 不熟悉（忘得差不多）的朋友也可以順便溫故知新唷～   …

上集聊完 DOM 基本概念和 JS 如何與 DOM 互動之後 Ex: innerHTML() , createElement() , appendChild() 等等 這集要來和大家介紹新手朋友看到就頭痛的「Callback function 回呼函式」，大家準備好了嗎？   看過第一、二集學習日記的朋友們應該都清楚：凡是在 JS 中所見即「物件」。所以，當我說函式 (function) 也是物件時，你應該覺得跟呼吸一樣自然? 但是，你有想過函式也能如同數值一般，作爲參數 (argument)…

好久不見～ 看完前兩集 JS 概念大補帖大家有沒有更清楚核心概念了呢？ 來快速複習一下前 10 點吧?   console控制台/ console.log 變數 型別 陣列 物件/ 物件導向 迴圈 for & while 函式 函式宣告式/表達式 建立函式的方法 閉包   如果看過以上主題還有覺得概念模糊的地方，歡迎回頭複習上集、下集～…

JS 基本概念大補帖（下） 你是否和我一樣快速入手 JS 時沒想太多，但到頭來才發現少了些什麼呢？ 那麼～這篇文章就是為你而寫 以下為 JS 五問下集，送給同是新手的你們 ? 如果還沒看上集的人先去看完再回來吧！   ? 什麼是迴圈？ 所謂迴圈就是一個永無止盡的迭代循環，簡單來說就是當滿足一定條件的情況下程式碼會自動幫你一次又一次的執行，直到達到另一個條件/限制（或是系統 crashdown ?）才會停止   常見的迴圈有兩種：For ＆ While   For 迴圈： 1.…

JS 基本概念大補帖（上） 你是否和我一樣快速入手 JS 時沒想太多，但到頭來才發現少了些什麼呢？ 那麼～這篇文章就是為你而寫 以下分為 JS 五問，送給同是新手的你們?   ? 1. 什麼是 console ？ 什麼又是 console.log? Console 譯成中文即為「控制台」，普遍來說是 Javascript 中最直接的編譯器，讓開發者（讓任何寫 JS 的人都能快速除錯、初步篩檢）。 Log 相對來說較為複雜，一般我們平常所知道的意思為「對數」或是「木材」…

Javascript在紅什麼？快跟著網頁設計小白?‍♀一起速速了解JS吧！ 這篇文章專給...   彷彿聽過，對JS 似曾相似，但從來沒有真正了解 愛用Google analytics & inbound marketing (Hubspot) 的行銷人 覺得跟前端工程師錯頻，想了解一下他們星球的語言 想學互動式網頁設計，創建屬於自己的第一個網頁天堂   上次最後提到了 React hooks 的優缺和功用 ，也賣了好多關子，這次趁著「 JS 學習筆記」系列的終結篇的機會讓小白?‍♀把剩餘的 React JS 的核心觀念補上＆好好說明白…

Javascript在紅什麼？快跟著網頁設計小白?‍♀一起速速了解JS吧！ 這篇文章專給...   彷彿聽過，對JS 似曾相似，但從來沒有真正了解 愛用Google analytics & inbound marketing (Hubspot) 的行銷人 覺得跟前端工程師錯頻，想了解一下他們星球的語言 想學互動式網頁設計，創建屬於自己的第一個網頁天堂   ? React 觀念澄清： 以下分為 3 大點盲點討論： class component ⚡ functional…