社區(qū)精選 | 叮~您有一封 Vue.js 挑戰(zhàn)邀請(qǐng)函,請(qǐng)查收
今天為各位推薦的是社區(qū)作者 null仔 的文章 ，在這篇文章中他為大家介紹了一個(gè) Vue.js 在線挑戰(zhàn)平臺(tái) vuejs-challenges，希望能助力同學(xué)們學(xué)習(xí) Vue.js。
讓我們一起來(lái)看看吧！
前言
大家好,我是 webfansplz.今天要跟大家分享的是 vuejs-challenges,一個(gè) Vue.js 在線挑戰(zhàn)平臺(tái),它提供了一些題庫(kù),開(kāi)發(fā)者可以在線進(jìn)行挑戰(zhàn).通過(guò)這些挑戰(zhàn),我們可以進(jìn)一步了解和熟悉 Vue.js,希望它能對(duì)想學(xué)習(xí) Vue.js 的同學(xué)有所幫助.
背景
距離 Vue 3.0 發(fā)布已經(jīng)快兩年了,Vue 2.0 也在上周五迎來(lái)了它的最后一個(gè)版本 Vue 2.7,周五難道不應(yīng)該有周五的態(tài)度嗎...好吧,那我就周末再 Juan 起來(lái)~
Vue3 正式版發(fā)布快兩年了,筆者接觸 Vue3 也快兩年了 (兩年前一個(gè)項(xiàng)目的重構(gòu)搭上 "One Piece"的首班車(chē)).這段時(shí)間的實(shí)踐沉淀了一些經(jīng)驗(yàn),前段時(shí)間我就在想,有沒(méi)有可能有這樣一個(gè)平臺(tái),大家可以分享自己在工作中遇到的一些 Vue.js 難題,又可以通過(guò)別人分享的經(jīng)驗(yàn)受益.在幫助別人的時(shí)候,自己也能有收獲,那就太棒了.這也就是 vuejs-challenges 誕生的由來(lái),希望我們可以在這里相互分享,共同成長(zhǎng).
介紹
接下來(lái)跟大家介紹一下 vuejs-challenges :
題庫(kù)
vuejs-challenges 目前有 20 多道題目,題庫(kù)主要分為兩個(gè)維度:
難度
難度包含熱身/簡(jiǎn)單/中等/困難/地獄.挑戰(zhàn)者可以根據(jù)自身情況/需求選擇不同的難度進(jìn)行階段性的練習(xí).
標(biāo)簽
標(biāo)簽覆蓋了響應(yīng)式系統(tǒng) API 的考察,組合式 API 的應(yīng)用以及自定義指令,可組合函數(shù)的使用等.挑戰(zhàn)者可以挑選自己比較陌生/不熟悉的模塊進(jìn)行針對(duì)性的練習(xí).
挑戰(zhàn)方式
參與貢獻(xiàn)
完善已有題目的測(cè)試用例
提供針對(duì)題目的學(xué)習(xí)資料或方法
分享你在真實(shí)項(xiàng)目中遇到的 Vue.js 問(wèn)題（無(wú)論你找到答案與否）
通過(guò)在 Issue 下留言幫助他人
分享你的答案或解題思路
提案加入新的題目
文檔
原理
在線挑戰(zhàn)鏈接是如何生成的 ?
讀取題目?jī)?nèi)容 這個(gè)簡(jiǎn)單,對(duì)于精通使用 Node.js File System API 來(lái) CRUD 的我自然不在話下 ??.
題目?jī)?nèi)容轉(zhuǎn)化為鏈接 獲取到了文件內(nèi)容,那我們要怎么將它傳遞給 Playground 呢 ? 我們先來(lái)看一張圖:
const content = {
[文件名]: 文件內(nèi)容
}const url = `${SFC_HOST}#${編碼(content)}`
新提案提交的Issue是如何自動(dòng)生成PR的 ?
創(chuàng)建工作流:
# .github/workflows/issue-pr.yaml# 工作流名稱(chēng)name: Issue to Pull Request# 鉤子,監(jiān)聽(tīng)到issue創(chuàng)建和修改,調(diào)用此工作流on:
issues:
types: [opened, edited]# 具體邏輯jobs:
start:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- run: cd scripts && npm i --only=production
# 具體邏輯處理
- run: cd scripts/actions && npx ...
解析 Issue 內(nèi)容并轉(zhuǎn)換為題庫(kù)的內(nèi)容
提交PR
如何構(gòu)建題庫(kù)文檔 ?
Netlify
致謝
結(jié)語(yǔ)
SegmentFault 思否社區(qū)小編說(shuō)
自 2022-07-01 起 SegmentFault 思否公眾號(hào)改版啦！之后將陸續(xù)推出新的欄目和大家見(jiàn)面?。ㄕ?qǐng)拭目以待呀~?）
在「社區(qū)精選」欄目中，我們將為廣大開(kāi)發(fā)者推薦來(lái)自 SegmentFault 思否開(kāi)發(fā)者社區(qū)的優(yōu)質(zhì)技術(shù)文章，這些文章全部出自社區(qū)中充滿(mǎn)智慧的技術(shù)創(chuàng)作者哦!
希望通過(guò)這一欄目，大家可以共同學(xué)習(xí)技術(shù)干貨，GET 新技能和各種花式技術(shù)小 Tips。
歡迎越來(lái)越多的開(kāi)發(fā)者加入創(chuàng)作者的行列，我們將持續(xù)甄選出社區(qū)中優(yōu)質(zhì)的內(nèi)容推介給更多人，讓閃閃發(fā)光的技術(shù)創(chuàng)作者們走到聚光燈下，被更多人認(rèn)識(shí)。
「社區(qū)精選」投稿郵箱：[email protected]
投稿請(qǐng)附上社區(qū)文章地址
