---
tags: 2022 React 新手讀書會
---
# 🏅 Day 1｜React JSX

在開始寫 React 之前，一定要先了解 JSX，因為在 React 中會大量的使用到這樣的寫法。JSX 是一個 JavaScript 的語法擴充，在寫 React 的時候會透過這樣的語法來做出使用者介面，相當於 template 和 JS 的混合用法，簡單的範例如下：

const element = <h1>你好，世界！</h1>;

[完整的 JSX 介紹請參考此文件](https://zh-hant.reactjs.org/docs/introducing-jsx.html)

## 題目
請複製 （右下角 fork）這個[範例](https://codepen.io/hexschool/pen/QWmWVXP)，並撰寫 JSX 完成以下畫面：

備註：
- 請用 `<h1>` 標籤
- 請使用 formatName 函式來組合 firstName、lastName

## 回報流程
將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）

<!-- 解答：

// 練習區塊ㄧ
function formatName(user) {
  return user.firstName + ' ' + user.lastName;
}
// 區塊結束

// 練習區塊二
const element = <h1> {formatName(user)} 是一位 {user.description}</h1>;
// 區塊結束

-->

回報區
---

| Discord | CodePen / 答案 |
|:-----------------------:|:------------------------------------------------------------------------:|
| Rice#8043 | [Codepen](https://codepen.io/riecball/pen/GRxvNGM?editors=1010) |
| yunyun#5215 | [Codepen](https://codepen.io/yun_yunni/pen/oNqpqwj) |
| rainbow#3329 | [Codepen](https://codepen.io/g901612002/pen/eYMyMGX?editors=1010) |
| LEO#7779 | [Codepen](https://codepen.io/nekorice/pen/XWEVEaw) |
| DIANAxAKKO#4298 | [Codepen](https://codepen.io/redfire29/pen/gOeoeGR) |
| Ayre#0016 | [Codepen](https://codepen.io/yichunlin09/pen/OJvzvxx?editors=0010) |
| Morris#8755 | [Codepen](https://codepen.io/morrisss/pen/wvmpmrp) |
| Midnightdinner#6220 | [Codepen](https://codepen.io/woowooyong/pen/oNqpqob) |
| 布魯諾#7239 | [Codepen](https://codepen.io/bruno-yu/pen/NWYXYXY) |
| lingxuan | [Codepen](https://codepen.io/lingxuan0618/pen/LYdedzp) |
| 黃士桓#7654 | [codePen](https://codepen.io/shr-huan-huang/pen/poLpLaQ) |
| AllenW#1132 | [codePen](https://codepen.io/AllenW/pen/YzaYaxW?editors=1011) |
| Bumble幫啵#0255 | [codePen](https://codepen.io/lmpzezvw-the-lessful/pen/gOeoeBX) |
| Timothy#5863 | [codePen](https://codepen.io/timothy_hippo/pen/jOzYzxv?editors=1011) |
| Paper#1658 | [CodePen](https://codepen.io/paper_hsiao/pen/XWEVEor) |
| Evonne#7078 | [CodePen](https://codepen.io/Hsu1Fang/pen/vYRpRRg?editors=1010) |
| Mr.Sean#3825 | [CodePen](https://codepen.io/sean_1215/pen/ExEoEpx?editors=1010) |
| kevinhes #2881 | [CodePen](https://codepen.io/kevinhes/pen/wvmpmNX?editors=1011) |
| huch09#1426 | [Codepen](https://codepen.io/subarashii-huch09/pen/WNzdzPa?editors=1010) |
| ZengZeng | [Codepen](https://codepen.io/tyzyoko/pen/YzaYagV) |
| Kelvin#3296 | [Codepen](https://codepen.io/kelvinchang/pen/xxWpWNV) |
| YenYing#4029 | [Codepen](https://codepen.io/yenying0804/pen/QWmamVV?editors=1010) |
| L0F0#8733 | [Codepen](https://codepen.io/l0f0/pen/wvmpmbx?editors=1011) |
| CofCat#9226 | [Codepen](https://codepen.io/cofcat456/pen/MWVrVNM?editors=1010) |
| RON#2813 | [Codepen](https://codepen.io/Ron115/pen/yLKpKWW) |
| Yukon#2618 | [Codepen](https://codepen.io/ukowork/pen/QWmaryo) |
| KuoMin#4931 | [Codepen](https://codepen.io/KuoMin/pen/dymJeMz) |
| Overy#4545 | [Codepen](https://codepen.io/oceanwhale52hz/pen/oNqpdLw) |
| Iris#8462 | [Codepen](https://codepen.io/irissamy/pen/WNzdJxm) |
| 小熊#0685 | [Codepen](https://codepen.io/YuHan0704/pen/MWVrGbY?editors=1010) |
| 無名#6427 | [Codepen](https://codepen.io/Nomoney/pen/wvmpjdN?editors=1010) |
| Mischa | [Codepen](https://codepen.io/mischa_0528/pen/abYEGpB) |
| m_m#5493 | [Codepen](https://codepen.io/minnn7716/pen/OJvzZXo) |
| LinaChen#1796 | [Codepen](https://codepen.io/LinaChen/pen/mdxpxjw) |
| 威爾#1694 | [CodePen](https://codepen.io/WILL_Wu/pen/yLKpjPN) |
| JC#8658 | [Codepen](https://codepen.io/jcsamoyed/pen/rNdpvqj) |
| Kimi#2092 | [Codepen](https://codepen.io/a3216lucy/pen/VwXyxNB) |
| React-慧茹(拉拉醬)#3414 | [Codepen](https://codepen.io/lala-lee-jobs/pen/OJvzELK) |
| fannnny#7112 | [Codepen](https://codepen.io/fannyHO/pen/BarJxXX?editors=1010) |
| 露易莎#7673 | [Codepen](https://codepen.io/louisa-lin/pen/xxWpzGW) |
| Ada | [Codepen](https://codepen.io/zggsoagv-the-scripter/pen/jOzYKEq) |
| ChloeLo#4858 | [Codepen](https://codepen.io/chloelo/pen/abYEGXL) |
| aki | [codepen](https://codepen.io/aki168/pen/WNzdyQr) |
| Arista#5802 | [codepen](https://codepen.io/arista-hsieh/pen/JjLMZdv) |
| hiYifang #0736 | [codepen](https://codepen.io/hiYifang/pen/GRxydLz) |
| Seijo #1585 | [codepen](https://codepen.io/SeijoHuang/pen/YzaYvWB?editors=1010) |
| 座標33129#8748 | [Codepen](https://codepen.io/ad80352/pen/xxWpzXa?editors=1010) |
| HedgehogKU | [CodePen](https://codepen.io/hedgehogkucc/pen/gOeoKob?editors=1010) |
| Aaron | [CodePen](https://codepen.io/narrowd4c/pen/WNzdyOG) |
| niel#2413 | [CodePen](https://codepen.io/danielhsu/pen/NWYXzLd?editors=1111) |
| Carolkiki2003#7399 | [CodePen](https://codepen.io/wasfzuig/pen/MWVrXPQ) |
| JimmyChang#5558 | [CodePen](https://codepen.io/JimmyChangWenChi/pen/gOeoKep) |
| wenyun#2362 | [CodePen](https://codepen.io/wenyuncc/pen/JjLMBdQ) |
| 𝓛𝓊𝒸𝓎#8635 | [CodePen](https://codepen.io/lucygirl/pen/KKoZBdo) |
| Rui#5058 | [CodePen](https://codepen.io/rui0208/pen/BarJPpd) |
| yuyu#6310 | [CodePen](https://codepen.io/yuyu0905/pen/wvmpxpp) |
| zzly#9134 | [CodePen](https://codepen.io/ly00/pen/abYEjqo) |
| 葉秋#2335 | [CodePen](https://codepen.io/as880074/pen/dymJjjp) |
| Stacy#1442 | [CodePen](https://codepen.io/keebibmh/pen/wvmpxxm) |
| Kunda#2800 | [CodePen](https://codepen.io/kunda0818/pen/jOzYpjd) |
|lloyd#8224| [CodePen](https://codepen.io/thanatus25/pen/NWYXBmL) |
| JarDar#6980 |[codepen](https://codepen.io/jardarpen/pen/VwXyGEx) |
| Robert Lo#9653 |[codepen](https://codepen.io/Robert-Lo/pen/BarJOdv?editors=1010) |
|Tuhacrt#0008|[CodePen](https://codepen.io/Tuhacrt/pen/WNzdgPN)|
|hw#0715|[Codepen](https://codepen.io/Lhwei/pen/RwMxYXE)|
|pollylien|[Codepen](https://codepen.io/cianying/pen/bGvaxmP?editors=1010)|
|小夜|[Codepen](https://codepen.io/Naito_K/pen/vYRpVBQ?editors=1010)
|BEAN#8402|[Codepen](https://codepen.io/Beanhuang/pen/NWYXOdx)
|Joechiboo|[Codepen](https://codepen.io/joe-chiboo/pen/RwMxeOP)
|sihyun#6318|[Codepen](https://codepen.io/siyuch/pen/ExEoOYG)
|SHIN#6075|[Codepen](https://codepen.io/shin9626/pen/vYRpVvY)
| moitw | [codepen](https://codepen.io/tsuifei/pen/dymJQpo?editors=1010)|
| yunyun#2239 | [CodePen](https://codepen.io/jarita0826/pen/qBopQQb) |
|灰塵貓#7994|[Codepen](https://codepen.io/rjk66268/pen/mdxpQjm?editors=0011)|
|布魯布魯#6177|[CodePen](https://codepen.io/akai-huang/pen/PoRExBJ)|
|RayRayHuang#1998|[CodePen](https://codepen.io/hongrueihuang/pen/dymJwbv)
|Vivi0225#3634|[Codepen](https://codepen.io/vivian820225/pen/GRxyPjd)|
|shin#5792|[Codepen](https://codepen.io/hah1030/pen/YzaYdJv)|
|Yiling#4054|[Codepen](https://codepen.io/lin010/pen/WNzdLKV?editors=1010)|
|TaoDoris#5230|[Codepen](https://codepen.io/taomaomao/pen/mdxpvPg?editors=1011)|
|Yanyan#3555 |[Codepen](https://codepen.io/wei-yi-lee/pen/WNzdPow)|
史蒂夫#5075 |[Codepen](https://codepen.io/TaroPanda/pen/jOzYdLV)|
| Stanley#2505 | [Codepen](https://codepen.io/bigbearada/pen/OJvzdGX) |
| -------------------- | --------------------------------------------------------------------------------- |
| Neal#0665 | [Codepen](https://codepen.io/neallkf/pen/QWmaYmd?editors=1010) |
| count1count2#9636 | [Codepen](https://codepen.io/souhakusou/pen/oNqpVvK?editors=1011) |
| 芝麻凜#1627 | [Codepen](https://codepen.io/bardkidd/pen/bGvaZqo?editors=0110) |
| Dylan_Lin#7320 | [CodePen](https://codepen.io/lin-dylan/pen/qBopvEz?editors=1010) |
| Tsuei#9284 | [CodePen](https://codepen.io/AlbertoLL/pen/BarJbrm?editors=1111) |
| Yihan#5560 | [CodePen](https://codepen.io/h513hh513h/pen/VwXyRGK?editors=1011) |
| Vada Chen #2055 | [CodePen](https://codepen.io/vadachen/pen/poLpYxq) |
| easton#3863 | [Codepen](https://codepen.io/EastonIsCodingNow/pen/wvmpOVX) |
| A-Kai#2134 | [Codepen](https://codepen.io/kenneth1002/pen/ZExvZzg?editors=1011) |
| christina#6185 | [Codepen](https://codepen.io/chrisc0210/pen/XWEVGQr) |
| Claire#2116 | [Codepen](https://codepen.io/claire-chang-the-bashful/pen/ZExvZbz) |
| Rose Wu#1669 | [Codepen](https://codepen.io/Rose-Wu/pen/rNdpbMV) |
| 小班#3324 | [Codepen](https://codepen.io/jlhung168/pen/QWmaPre) |
| 楓之聲#6945 | [codepen](https://codepen.io/sshane258/pen/GRxyLyB) |
| charlottelee849#0366 | [Codepen](https://codepen.io/charlotte-lee/pen/vYRpMLe?editors=1012) |
| Sylvia-H #0024 | [Codepen](https://codepen.io/Cosmosheart/pen/XWEVQyp) |
| kyle890721#1016 | [Codepen](https://codepen.io/KYLE890721/pen/KKoZYaj) |
| 紅豆豆#0518 | [Codepen](https://codepen.io/zoseqlpc/pen/zYWpQOd?editors=0010) |
| Ryder#7398 | [Codepen](https://codepen.io/rider159159/pen/zYWpQjj?editors=1010) 樓下嚇我一跳XD |
| Rikku#1756 | [Codepen](https://codepen.io/rikkubook/pen/RwMxmyX) 哈哈哈哈XD |
| wiimax#4564 | [Codepen](https://codepen.io/willismax/pen/qBopGML) |
| 𝔼.𝕎#4742 | [Codepen](https://codepen.io/kidult316/pen/ExEoBKM) |
| JimHwang#3594 | [Codepen](https://codepen.io/jimh1129/pen/qBopzNe) |
| Zihur#7755 | [Codepen](https://codepen.io/Zihur/pen/KKoZjdQ?editors=1010) |
| 山貓(焜)#7041 | [Codepen](https://codepen.io/pen?template=XWEVLRG) |
| margo#7139 | [Codepen](https://codepen.io/ssuchen_lee/pen/qBopzRW?editors=0011) |
| bonnieli1414#4906 | [Codepen](https://codepen.io/bonnieli1414/pen/bGvaPYa?editors=1010) |
| Alex Liao#8538 | [CodePen](https://codepen.io/alex0207s/pen/QWmaXOr) |
| Dale Hsu#0355 | [CodePen](https://codepen.io/dale_hsu/pen/wvmpLjp) |
| 龜人#7299 | [CodePen](https://codepen.io/dullshen/pen/rNdpEyo) |
| 雅帆 | [CodePen](https://codepen.io/yafanchung/pen/xxWpvGV) |
| Renren #8437 | [CodePen](https://codepen.io/ehren-chen/pen/BarJXmv) |
| 真．穎旻粉撕#4995 | [CodePen](https://codepen.io/gbnbihif/pen/QWmaegR?editors=1010) |
| POKA #2168 | [CodePen](https://codepen.io/POKAHSIAO/pen/rNdpXpe?editors=1010) |
| Pandaa#7740 | [CodePen](https://codepen.io/pandaachu/pen/mdxpNzG) |
| Evileye#0666 | [Codepen](https://codepen.io/gn-lin/pen/YzaYmJL) |
| crowley#7180 | [CodePen](https://codepen.io/pon88/pen/vYRdErj?editors=1010) |
| Wu#0167 | [CodePen](https://codepen.io/Xander0705/pen/wvmpYVJ) |
| Mitour#0672 | [CodePen](https://codepen.io/mitour/pen/poLajBq?editors=0010) |
| 魚魚#0937 | [CodePen](https://codepen.io/fish0522/pen/gOevPpv) |
| Kenge#3690 | [CodePen](https://codepen.io/pgkusn/pen/JjLpGbb) |
| 棒腿#9350 | [CodePen](https://codepen.io/frankHsu/pen/eYMVJvm) |
| 翔#0859 | [CodePen](https://codepen.io/energy95272z/pen/eYMVJPz) |
| Doris#1140 | [CodePen](https://codepen.io/doris79588/pen/GRxQozw) |
| Eric Su#7798 | [CodePen](https://codepen.io/wc-su/pen/ZExvVOE) |
| East#4003 | [CodePen](https://codepen.io/EastM/pen/mdxXPWg?editors=1010) |
| shoppingq | [CodePen](https://codepen.io/shoppingq/pen/JjLpGxr) |
| carrieT#9628 | [CodePen](https://codepen.io/echocarriet/pen/MWVQeJB) |
| 城堡#2126 | [Codepen](https://codepen.io/tthcastle/pen/LYdQZwZ) |
| EvaLin#4546 | [Codepen](https://codepen.io/evalin0316/pen/LYdQRER) |
| ねこ*#9385 | [Codepan](https://codepen.io/kunpao0104/pen/VwXQKJd) |
| IreneLee#7932 | [Codepan](https://codepen.io/ntjtcxpt-the-animator/pen/VwXQmrg?editors=1010) |
| andersonshen#4675 | [Codepan](https://codepen.io/luxyenni-the-bold/pen/QWmQGzp) |
| YJ#1839 | [Codepan](https://codepen.io/cshjufxc/pen/poLaejY) |
| Evachan#5729 | [Codepan](https://codepen.io/Eva-go/pen/QWmQpXW) |
| Hank Hsiao#8569 | [Codepan](https://codepen.io/hank-hsiao/pen/ExEQmwQ) |
| leoneboy#0851 | [Codepan](https://codepen.io/Leoneboy/pen/oNqprQL?editors=1111) |
| Otis#8455 | [Codepan](https://codepen.io/humming74/pen/wvmyeqe) |
| IceSam#7836 | [Codepen](https://codepen.io/sam-hsu/pen/QWmaYQd) |
| Chaim#5739 | [Codepen](https://codepen.io/hgit915/pen/vYRdJGJ) |
| 陳sam#9117 | [Codepen](https://codepen.io/euldpliv/pen/gOevGaE) |
| Li-Ninja#0471 | [Codepen](https://codepen.io/li-ninja/pen/NWYyaJb?editors=0110) |
| Anson #3594 | [Codepen](https://codepen.io/huanmingchang/pen/LYdQOGo) |
| Mickey Hsu #9693 | [Codepen](https://codepen.io/kikmiao1995/pen/NWYyaaG) |
| Viva #2816 | [Codepen](https://codepen.io/viva-chan/pen/VwXQrKw) |
| 時雨 #8837 | [Codepen](https://codepen.io/jjustin-35/pen/KKoQygZ) |
| JessSong#5050 | [Codepen](https://codepen.io/jssanji03/pen/abYqVwx) |
|TedWang|[Codepen](https://codepen.io/wangtaiyan/pen/PoRQOXK?editors=1011)|
|GL#2256|[Codepen](https://codepen.io/4genie/pen/XWEZVRb)|
| Yushi #3972 | [Codepen](https://codepen.io/yus3/pen/xxWporv) |
| 連小艾#0791 | [Codepen](https://codepen.io/bolaslien/pen/qBoxpgX?editors=1010) |
| Emily Hsi #9066 | [Codepen](https://codepen.io/EmilyHsi/pen/gOevray) |
|鉛筆#7763| [Codepen](https://codepen.io/zoeguava/pen/JjLpLJQ?editors=0011) |
|anby#7112| [Codepen](https://codepen.io/andy-ch-bo-an/pen/zYWRWLQ?editors=1011) |
|喬喬#2824| [Codepen](https://codepen.io/joanne-wei/pen/mdxXayw?editors=1010) |
|黑白兔#0684| [Codepen](https://codepen.io/johnny329/pen/bGvYPzm) |
|Nico#8739| [Codepen](https://codepen.io/Nicof2e/pen/ExEQroo) |
| 吉利#3810 |[codepen](https://codepen.io/gillianyy/pen/mdxXvWv) |
| Shani#4593 |[codepen](https://codepen.io/ShaniMa/pen/WNzMWey) |
| 薯餅#3581 |[codepen](https://codepen.io/ColdingPoTaTo/pen/oNqEOXL) |
| k.sin#3115 |[codepen](https://codepen.io/sin588/pen/ExEQJrN?editors=1011) |
| 彼得#1923 |[codepen](https://codepen.io/shiou-ho/pen/MWVQdVp) |
| Neuf#3083 | [codepen](https://codepen.io/yifanneuf/pen/QWmQXra?editors=0010)|
| Chelly#6129 | [Codepen](https://codepen.io/chellyhsu/pen/bGvLPPL?editors=1111) |
| hungya#0773 | [codepen](https://codepen.io/hungya777/pen/JjLLPjy)|
| JasonLU#7163 | [codepen](https://codepen.io/wnptocip/pen/MWVVgpj?editors=1010)|
| yoshidc#0455 | [codepen](https://codepen.io/yoshiyyc/pen/RwMQqYG)|
|minmin#8960|[codepen](https://codepen.io/minfan-chen/pen/yLKKLrR?editors=1111)|
|hobby#6565|[codepen](https://codepen.io/hobbyling/pen/eYMMNbG)|
|yiwun#0953|[codepen](https://codepen.io/kagamiakira_IBUN/pen/jOzzbGa)|
| whatsupmm#6761 | [Codepen](https://codepen.io/meidada/pen/JjLLJKw?editors=1010) |
| 眼睛 #0314 | [Codepen](https://codepen.io/riecball/pen/GRxvNGM?editors=1010) |
| larahuang#8309 | [Codepen](https://codepen.io/lara1105huang/pen/jOzzmLb) |
| Shau#6400 | [Codepen](https://codepen.io/shau-chen/pen/XWEEzbE) |
| 豆豆#9088 | [Codepen](https://codepen.io/qaz326978547/pen/jOzzaQZ) |
| MarsKuo#6015 | [Codepen](https://codepen.io/MarsKuo/pen/vYRRRmB) |
| Murmurline#6969 | [Codepen](https://codepen.io/murmurline/pen/BarrOLJ) |
| kir4che#7701 | [Codepen](https://codepen.io/kir4che/pen/qBoYEqd) |
| Carol Li #2269| [Codepen](https://codepen.io/carolli834/pen/zYWjGZo?editors=1010)|
| 蘇蘇 #0426| [Codepen](https://codepen.io/sabine1123/pen/qBoYOXL)|
| Josh DB #3366 | [Codepen](https://codepen.io/joshjong/pen/eYMrvQq)|
| kotony #1552 |[Codepen](https://codepen.io/myjekfdm/pen/zYWjEgE)|
| NinaKuo#3332 |[Codepen](https://codepen.io/ninakuo0814/pen/BarxYLG)|
| john21429#9343 |[Codepen](https://codepen.io/john21429/pen/bGvMMXx)|
|YuZhun#1362|[Codepen](https://codepen.io/danzhun/pen/PoReZqp?editors=1011)|
|許揚民 Evan#4546|[Codepen](https://codepen.io/gitevanhsu/pen/abYGMbV)|
|emma #3398|[Codepen](https://codepen.io/itsems/pen/NWYMmdw?editors=1010)|
|Judy ☻#7874|[Codepen](https://codepen.io/hsiaohan/pen/gOezyZG?editors=1010)|
|Wins #8457|[Codepen](https://codepen.io/winszhuang/pen/VwXxJqJ)|
| Wendy Chang #8310 |[Codepen](https://codepen.io/Zhangbun/pen/JjLvWbj)
|夕璇#5662|[Codepen](https://codepen.io/SiShiuan/pen/PoRaYMg?editors=1010)|
|猜猜我是誰|[codepen](https://codepen.io/wei-nie/pen/BarVzGK?editors=0011)|
| 咻蹦#1526 |[codepen](https://codepen.io/emmasyu/pen/gOezyGW)|
| ryo#0160 |[codepen](https://codepen.io/ryo72/pen/ExERNgP)|
| james#1443 |[codepen](https://codepen.io/clothn0105700/pen/LYdrxNm?editors=0010)|
|阿暟|[codepen](https://codepen.io/patrickrrr007/pen/YzaaqPL)|
|Louise|[codepen](https://codepen.io/LouiseHuang/pen/gOeKmom)|
|toshow#5609|[CodePen](https://codepen.io/toshow/pen/vYRrPGz)|
|Sabrina77#1675|[CodePen](https://codepen.io/sabrina-huang/pen/QWmxorE?editors=1010)|
|Justin|[CodePen](https://codepen.io/just-perfect/pen/YzajKdY)|
|Double C#7388|[codepen](https://codepen.io/Double-C/pen/ZExrLMw)|
|sophiee#7015 |[codepen](https://codepen.io/sophiee2727/pen/ExEpLaL?editors=1111)|
|ninipopo#7983 |[codepen](https://codepen.io/Robinnini/pen/xxWJaeo)|
|Cookie SSS#6991|[codepen](https://codepen.io/sqhjikpa-the-selector/pen/MWVBoxm?editors=1010)|
|Rocker#6235|[codepen](https://codepen.io/RockerLi/pen/KKoBVxR)|
|VicSun|[codepen](https://codepen.io/hsuan333/pen/bGvxgbQ)|
|雪莉#4827|[codepen](https://codepen.io/utshang216/pen/OJvBJgB)|
|Frank5177|[codepen](https://codepen.io/Frankhu5150/pen/WNzajxE?editors=1010)|
|Cherry ZY#4647|[CodePen](https://codepen.io/qoosdd89382/pen/abYRwmN?editors=0010)|
|hsiuhsiu #7412|[CodePen](https://codepen.io/hsiuhsiu/pen/RwMejoj?editors=1010)|
|Mori#5582|[CodePen](https://codepen.io/flower9312/pen/mdxzprv)|
|魚魚#1220|[CodePen](https://codepen.io/vkkkmkbv-the-selector/pen/GRxYewB)|
|SunnyCheng#4113|[CodePen](https://codepen.io/Sunny0509/pen/mdxzZwq)|
|kancheng#3915|[CodePen](https://codepen.io/kancheng/pen/wvmQZVa)|
|helen #1041 |[CodePen](https://codepen.io/Tian-Lin/pen/QWmJRqv)
|Emily #3648 |[CodePen](https://codepen.io/flien/pen/NWYBXpd?editors=1010)|
|eching#9183 |[CodePen](https://codepen.io/echin/pen/poLGLQx?editors=1010)|
|SleepWalk#1635 |[CodePen](https://codepen.io/arthurliinn/pen/gOeEOLr?editors=0011)|
|Eileen#6454 |[CodePen](https://codepen.io/Eileen-io/pen/jOzJErQ)|
|toshow#5609|[Codepen](https://codepen.io/toshow/pen/qBQgONZ)
|Eshiunm|[Codepen](https://codepen.io/Code-My/pen/eYojbjW)