Page 29

圆框中有打勾的符号

为 Astro 设置 ESLint 与 Prettier

我喜欢使用自动化的工具来为专案的代码提供错误检查与整理,因此使用 ESLint 与 Prettier 让撰写的代码更一致无错,还有额外添加 TypeScript 的检查与 VSCode 提示,本篇文章有详细的教学范例引导你在 Astro 中安装 ESLint 与 Prettier 套件。

圓框中有打勾的符號

為 Astro 設置 ESLint 與 Prettier

我喜歡使用自動化的工具來為專案的代碼提供錯誤檢查與整理,因此使用 ESLint 與 Prettier 讓撰寫的代碼更一致無錯,還有額外添加 TypeScript 的檢查與 VSCode 提示,本篇文章有詳細的教學範例引導你在 Astro 中安裝 ESLint 與 Prettier 套件。

愛心符號

制作个人前端作品集 - 准备篇

记录一下我是如何制作自己的前端作品集的,随着从大学毕业,很快也要步入社会寻找正职工作,因此急需一个可以展示自己作品的平台,既然身为前端开发者,何不动手制作一个作品集网站呢?制作自己的作品集是必经历的体验,也是一趟很有趣的体验。

愛心符號

製作個人前端作品集 - 實作篇

Astro 作为一个静态内容为主的生产器非常适合用于打造静态网页,这次我将用自己的作品集为案例教你打造一个实际的静态网站,通过以自己的作品集网站为范例,借助这个机会来展示这个框架好用与强大的地方。只需要有基础的 HTML 与 CSS 知识就能跟着这篇文章创造一个属于自己的作品集。

愛心符號

製作個人前端作品集 - 準備篇

記錄一下我是如何製作自己的前端作品集的,隨著從大學畢業,很快也要步入社會尋找正職工作,因此急需一個可以展示自己作品的平台,既然身為前端開發者,何不動手製作一個作品集網站呢?製作自己的作品集是必經歷的體驗,也是一趟很有趣的體驗。

愛心符號

製作個人前端作品集 - 實作篇

Astro 作為一個靜態內容為主的生產器非常適合用於打造靜態網頁,這次我將用自己的作品集為案例教你打造一個實際的靜態網站,透過以自己的作品集網站為範例,借助這個機會來展示這個框架好用與強大的地方。只需要有基礎的 HTML 與 CSS 知識就能跟著這篇文章創造一個屬於自己的作品集。

图片符号

我可以把图片放在标题里面吗?

有时候为了装饰用途会需要用图片来显示标题,于是我开始思考“把图片放在标题里面”是不是和规的 HTML?是不是一个好的作法?主要查阅了 Google Search Central 的回应以及 MDN 文件,结论是和规的,以及有更多可以留意的细节。

圖片符號

我可以把圖片放在標題裡面嗎?

有時候為了裝飾用途會需要用圖片來顯示標題,於是我開始思考「把圖片放在標題裡面」是不是和規的 HTML?是不是一個好的作法?主要查閱了 Google Search Central 的回應以及 MDN 文件,結論是和規的,以及有更多可以留意的細節。

Astro Logo 符號

創建靜態為主的網站?一定要來試試 Astro.js!

目前本部落格就是使用 Astro 所建構,在從正式版還沒推出之前就使用著它來創建網頁到目前算是小有心得,加上也有許多人詢問過,於是就寫這篇文章來分享一下。在這之前我使用過很多不同的框架,像是 Next、Gatsby、Jekyll、HUGO,它們都是很好的框架,但一直沒有戳中我的需求……

開放框線中央有一個旋轉箭頭符號

了解網頁的三大渲染模式 Rendering Patterns feat. SSG, SSR, CSR

當建構一個網頁的時候,最首要面對的問題就是「網頁內容要怎麼生成並提交給用戶?」,而為了解決這個問題所產生的解決方法就是「網頁渲染模式 (Rendering Pattern)」。建構網站有許多種方式,藉由了解它們之間的取捨可以更好的幫助你建構下一個網頁專案。