iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 797 瀏覽

技術 NUXT.js 筆記 - 前言

此文章主要是在記錄自己在開發NUXT.js上遇到的一些問題與試著練習寫一篇"大家看得懂的"技術文，此次也是小弟我第一次編寫技術文章，所以若...

g0928817707 ‧ 2018-11-20

0 Like 0 留言 205 瀏覽

鐵人賽 Modern Web DAY 21

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 21 篇

技術 [Day 21] Vue Quasar 彈跳視窗 1 - Action Sheet

下方的彈出選單 Action Sheet Action Sheet 這是一個從螢幕下方彈跳出小選單的元件在Android及iOS上也都有類似的原生元件不過如...

RenZhou ‧ 2018-11-04

0 Like 0 留言 153 瀏覽

鐵人賽 Modern Web DAY 17

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 17 篇

技術 [Day 17] Vue Quasar 表單元件 7 - Option Group

選項元件直接打包一次做好Option Group Option Group 有時候要做一堆選項，是不是覺得要複製一大堆radio、checkbox很煩呢，所以我...

RenZhou ‧ 2018-10-31

0 Like 0 留言 190 瀏覽

鐵人賽自我挑戰組 DAY 17

使用Vue製作簡單的 WorkBoard （30天）系列第 17 篇

技術（第十七天）自我練習專案 - 資料的移動

開始練習 WorkBoard 需要的套件 Vue.Draggable 是這次我們用來製作 WorkBoard 的重要套件，這個套件可以實現我們在實作 Work...

LucyLiou ‧ 2018-10-30

0 Like 0 留言 168 瀏覽

鐵人賽 Modern Web DAY 14

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 14 篇

技術 [Day 14] Vue Quasar 表單元件 3 - Radio

簡單的單選元件 Radio Radio Quasar的Radio元件跟其他表單輸入元件的基本屬性都大同小異一樣也可以用QFiled把它包裝起來哦引入元件 f...

RenZhou ‧ 2018-10-28

1 Like 0 留言 556 瀏覽

鐵人賽 Modern Web DAY 13

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 13 篇

技術 13. Nuxt 客製頁面效果 - 轉場(Transition)

這篇是頁面客製段落其三，主題講「Nuxt 頁面轉場效果如何調整」回憶兩種暫態正在讀取中 => 讀取效果 (Loading) 頁面切換中 =>...

Ralph ‧ 2018-10-28 ‧團隊InfoSec Horadrim

0 Like 0 留言 157 瀏覽

鐵人賽 Modern Web DAY 13

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 13 篇

技術 [Day 13] Vue Quasar 表單元件 2 - Chips Input

輸入陣列的好幫手 Chips Input Chips Input 是不是有些時候建立使用者表單輸入時，會有能填多種值的欄位，像是興趣、職業等等。但是又怕使用...

RenZhou ‧ 2018-10-27

1 Like 0 留言 569 瀏覽

鐵人賽 Modern Web DAY 12

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 12 篇

技術 12. Nuxt 客製頁面效果 - 讀取(Loading)

這篇是頁面客製段落其二，主題講「Nuxt 頁面讀取效果如何調整」用來補充頁面細部設定讓我們回想錯誤頁面，是用來「呈現錯誤狀態的頁面元件」而頁面渲染前，N...

Ralph ‧ 2018-10-27 ‧團隊InfoSec Horadrim

0 Like 0 留言 201 瀏覽

鐵人賽 Modern Web DAY 12

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 12 篇

技術 [Day 12] Vue Quasar 表單元件 1 - Field

序大家好，這篇開始就開始來談後端表單常用到的元件吧～原本的旅遊系列再來的頁面都是以layout為主但是quasar的layout元件也差不多介紹完了才發...

RenZhou ‧ 2018-10-26

1 Like 0 留言 516 瀏覽

鐵人賽 Modern Web DAY 11

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 11 篇

技術 11. Nuxt 頁面驗證和錯誤顯示

接下來幾篇都屬頁面客製，這篇講「Nuxt 發生錯誤時，他怎麼判斷與反應」先回顧這張流程圖 Nuxt 收到請求時，會經過這麼多步驟而碰到不可預期的錯誤或頁面...

Ralph ‧ 2018-10-26 ‧團隊InfoSec Horadrim

0 Like 0 留言 313 瀏覽

鐵人賽 Modern Web DAY 11

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 11 篇

技術 [Day 11] Vue Quasar 打造旅遊網站系列 7 - Parallax、Breadcrumbs、Rating

GitHub Demo 今天完成後的畫面首頁部分已經差不多了剩下頁尾以及一些小區塊因為元件都跟之前的文章有重複到故在這邊就不實作會功能重複的區塊了製...

RenZhou ‧ 2018-10-25

0 Like 0 留言 843 瀏覽

鐵人賽 Modern Web DAY 11

VUE & PHP (Apache2) & Docker 實戰開發系列第 11 篇

技術 Day11 - Vue & Axios 封裝

今天換來做 VUE 先前已經將ROUTER & MATERIAL套用進來，這一次想實作封裝HTTP的功能，如 VUE官方推薦，我們要用axios。簡...

aa71435723 ‧ 2018-10-25

1 Like 0 留言 213 瀏覽

鐵人賽 Modern Web DAY 10

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 10 篇

技術 [Day 10] Vue Quasar 打造旅遊網站系列 6 - Cards (卡片)

GitHub Demo 今日完成的畫面首頁的第一個區塊做完了今天就來做第二個區塊吧先看看兩大家的頁面這種卡片形式的元件，咱們Quasar也有我...

RenZhou ‧ 2018-10-24

1 Like 0 留言 698 瀏覽

鐵人賽 Modern Web DAY 9

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 9 篇

技術 09. Nuxt 頁面元件細部設定

Nuxt 頁面元件跟 Vue File 哪裡不同？ Nuxt Routing 自動映射介紹過，/pages 的 Vue File 對應各個頁面。雖然寫法一樣，...

Ralph ‧ 2018-10-24 ‧團隊InfoSec Horadrim

0 Like 0 留言 267 瀏覽

鐵人賽 Modern Web DAY 9

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 9 篇

技術 [Day 9] Vue Quasar 打造旅遊網站系列 5- Popover (彈出視窗)

今天做完我們的頁面會長這樣～今天一樣接續昨天的部分～我們來做搜尋點擊但是還沒輸入時下面出現的視窗 KLOOK 的視窗雖然有圖片美觀，本來也想做像這種...

RenZhou ‧ 2018-10-23

1 Like 0 留言 918 瀏覽

鐵人賽 Modern Web DAY 8

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 8 篇

技術 08. Nuxt 客製《甜點電商》SEO 基本資訊

客製 SEO 資訊上一章讓登入頁有了基本樣貌，但需要 SSR 是為了解決兩大問題 SEO SMO 具體怎麼做？前端最基本的，在埋對應的 Meta T...

Ralph ‧ 2018-10-23 ‧團隊InfoSec Horadrim

0 Like 0 留言 421 瀏覽

鐵人賽 Modern Web DAY 8

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 8 篇

技術 [Day 8] Vue Quasar 打造旅遊網站系列 4 - Input、Autocomplete

今日做完後會長這樣繼續昨天的進度該補上搜尋的框框了先來看一下其他兩家的東西恩... 不簡單啊ＸＤ? 暫且不看下面的視覺選單先來打個字搜尋看看...

RenZhou ‧ 2018-10-22

2 Like 1 留言 1455 瀏覽

鐵人賽 Modern Web DAY 7

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 7 篇

技術 07. Nuxt 頁面怎麼切會更好？以電商登入頁為例

本來打算介紹 Nuxt 版面依功能劃分、由哪些區塊組成。想到六角學院才比完《甜點電商PK賽》，現成切好的版面很好找，參賽選手也不少，拿來說明與練習再適合不過。...

Ralph ‧ 2018-10-22 ‧團隊InfoSec Horadrim

0 Like 0 留言 270 瀏覽

鐵人賽 Modern Web DAY 8

VUE & PHP (Apache2) & Docker 實戰開發系列第 8 篇

技術 Day8 - Vue 專案啟動 Routing & Material

前面幾篇文章大致上把專案的初始建置完成，也放了一版於github可以參考。這邊我預計想要以一個簡單的主題來實作：房屋管理大致上會有有幾個主體(約略想)：...

aa71435723 ‧ 2018-10-22

0 Like 0 留言 386 瀏覽

鐵人賽 Modern Web DAY 7

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 7 篇

技術 [Day 7] Vue Quasar 打造旅遊網站系列 3 - Carousel (頁面輪播)

今天就來做我們的首頁吧～！！ ?? 其他兩家的首頁基本上都是圖片輪播的形式加上一個輸入匡來搜尋目的地那我們今天就來做這個輪播功能吧建立新的首頁由於...

RenZhou ‧ 2018-10-21

1 Like 0 留言 997 瀏覽

鐵人賽 Modern Web DAY 6

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 6 篇

技術 06. Nuxt Routing 規則入門

前一章我們新增 /pages/product.vue 編輯即可在 http://localhost:3000/product 預覽頁面。 pages/ --|...

Ralph ‧ 2018-10-21 ‧團隊InfoSec Horadrim

0 Like 0 留言 337 瀏覽

鐵人賽 Modern Web DAY 7

VUE & PHP (Apache2) & Docker 實戰開發系列第 7 篇

技術 Day7 - Vue-Lazyloading & Service worker Hook

上一篇學習了如何建立typescript & webpack & service worker的專案。今天繼續實作如果將service wor...

aa71435723 ‧ 2018-10-21

1 Like 0 留言 884 瀏覽

鐵人賽 Modern Web DAY 5

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 5 篇

技術 05. Nuxt 產生簡單頁面

前一章經 create-nuxt-app 生成的專案結構放法按照 Nuxt 預設結構，相比 Vue.js 專案，已經幫你訂好了規則，方便對應與依循各資料夾...

Ralph ‧ 2018-10-20 ‧團隊InfoSec Horadrim

0 Like 0 留言 426 瀏覽

鐵人賽 Modern Web DAY 5

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 5 篇

技術 [Day 5] Vue Quasar 打造旅遊網站系列 1 - Header

本篇演示項目 Toolbar ToolbarTitle Button 這幾天都在想要演示什麼主題會比較好想一想最近突然好想要出去玩那就乾脆來做旅遊網站好...

RenZhou ‧ 2018-10-19

0 Like 0 留言 465 瀏覽

鐵人賽 Modern Web DAY 5

VUE & PHP (Apache2) & Docker 實戰開發系列第 5 篇

技術 Day5 - Vue & Webpack & Service Worker 工欲善其事必先利其器

這一篇有跟大家介紹了Service Worker的應用，今天想帶一下Webpack，強大的打包工具。我會希望我的前端，能夠用到Webpack + Servi...

aa71435723 ‧ 2018-10-19

1 Like 1 留言 1211 瀏覽

鐵人賽 Modern Web DAY 4

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 4 篇

技術 04. Nuxt 環境建立

這篇寫常用情境產生新 Nuxt 專案 Vue.js SPA 寫一半，得追加 SSR 產生完整 Nuxt 專案入門寫 Vue.js，新專案用 Vue-cl...

Ralph ‧ 2018-10-19 ‧團隊InfoSec Horadrim

0 Like 0 留言 548 瀏覽

鐵人賽 Modern Web DAY 4

[Vue] 使用 Quasar 輕鬆打造 Material 及 iOS 風格的響應式網站系列第 4 篇

技術 [Day 4] Vue Quasar Framework 頁面Layout介紹

今天就讓我們直接開始吧～！前面幾天我們有執行過部署的指令了不過我們這邊再複習一下 $ quasar init helloworld $ cd hellow...

RenZhou ‧ 2018-10-18

1 Like 0 留言 1386 瀏覽

鐵人賽 Modern Web DAY 3

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 3 篇

技術 03. Nuxt.js 怎麼處理 SSR 問題？擔任什麼角色？

關於 Universal Rendering 前一篇提到，原本前後端的 View 各自分開隨著前端漸漸吃重，為了讓畫面邏輯不需要分散各處，有人提出新的架構 -...

Ralph ‧ 2018-10-18 ‧團隊InfoSec Horadrim

0 Like 0 留言 454 瀏覽

鐵人賽 Modern Web DAY 2

JavaScript 音樂漫遊 - 30 天探索 Web Audio！系列第 2 篇

技術 01. 基礎建設

馬上要開始介紹 Web Audio API 了，總要有個網站來呈現各種內容吧；既然要學東西，那就順便把不熟的 Vue 架起來玩一玩囉！開始之前筆者預期讀者您...

Gary ‧ 2018-10-17 ‧團隊浪流連九程式匠自然產生的佛系碼農專區

3 Like 0 留言 1380 瀏覽

鐵人賽 Modern Web DAY 2

Nuxt - 使用 Vue.js 做 SSR 的第一哩路系列第 2 篇

技術 02. 講歷史，話說 SSR...

什麼叫做 SSR? Server-Side Rendering，頁面由後端渲染，HTML由後端產生　　傳統做法整頁HTML不就完全由後端產生嗎？使用...

Ralph ‧ 2018-10-17 ‧團隊InfoSec Horadrim

技術 NUXT.js 筆記 - 前言

技術 [Day 21] Vue Quasar 彈跳視窗 1 - Action Sheet

技術 [Day 17] Vue Quasar 表單元件 7 - Option Group

技術 （第十七天）自我練習專案 - 資料的移動

技術 [Day 14] Vue Quasar 表單元件 3 - Radio

技術 13. Nuxt 客製頁面效果 - 轉場(Transition)

技術 [Day 13] Vue Quasar 表單元件 2 - Chips Input

技術 12. Nuxt 客製頁面效果 - 讀取(Loading)

技術 [Day 12] Vue Quasar 表單元件 1 - Field

技術 11. Nuxt 頁面驗證和錯誤顯示

技術 [Day 11] Vue Quasar 打造 旅遊網站系列 7 - Parallax、Breadcrumbs、Rating

技術 Day11 - Vue & Axios 封裝

技術 [Day 10] Vue Quasar 打造 旅遊網站系列 6 - Cards (卡片)

技術 09. Nuxt 頁面元件細部設定

技術 [Day 9] Vue Quasar 打造 旅遊網站系列 5- Popover (彈出視窗)

技術 08. Nuxt 客製《甜點電商》SEO 基本資訊

技術 [Day 8] Vue Quasar 打造 旅遊網站系列 4 - Input、Autocomplete

技術 07. Nuxt 頁面怎麼切會更好？以電商登入頁為例

技術 Day8 - Vue 專案啟動 Routing & Material

技術 [Day 7] Vue Quasar 打造 旅遊網站系列 3 - Carousel (頁面輪播)

技術 06. Nuxt Routing 規則入門

技術 Day7 - Vue-Lazyloading & Service worker Hook

技術 05. Nuxt 產生簡單頁面

技術 [Day 5] Vue Quasar 打造 旅遊網站系列 1 - Header

技術 Day5 - Vue & Webpack & Service Worker 工欲善其事必先利其器

技術 04. Nuxt 環境建立

技術 [Day 4] Vue Quasar Framework 頁面Layout介紹

技術 03. Nuxt.js 怎麼處理 SSR 問題？擔任什麼角色？

技術 01. 基礎建設

技術 02. 講歷史，話說 SSR...

At

技術（第十七天）自我練習專案 - 資料的移動

技術 [Day 11] Vue Quasar 打造旅遊網站系列 7 - Parallax、Breadcrumbs、Rating

技術 [Day 10] Vue Quasar 打造旅遊網站系列 6 - Cards (卡片)

技術 [Day 9] Vue Quasar 打造旅遊網站系列 5- Popover (彈出視窗)

技術 [Day 8] Vue Quasar 打造旅遊網站系列 4 - Input、Autocomplete

技術 [Day 7] Vue Quasar 打造旅遊網站系列 3 - Carousel (頁面輪播)

技術 [Day 5] Vue Quasar 打造旅遊網站系列 1 - Header