jack-yong / frontend-practice

这个仓库主要用来存放前端学习的一些小demo，主要是锻炼自己的css，以及js的基本功，本项目使用的是cra脚手架并且基于ts语言编写。

👀为了锻炼自己的前端技术的基本功，这个仓库里面主要存放一些日常练习的小demo.在学习之余我也会编写对应的学习心得文章,盼望惠览.

• 掘金
• CSDN

## 项目来源

在Github上⭐数量很高的一个开源项目:50天50个小项目

通过学习上述小项目的源码,尤其是css,从而提高自己前端开发的基础能力.

技术栈

自己平时主要使用的技术栈是react+ts+sass,所以练习的过程中使用到了以下的技术栈.

• Typescript
• sass
• React

计划表

下方列出了已经完成的demo.

#	demo名称	完成情况
01	Expanding Cards	👌
02	Progress Steps	😥
03	Rotating Navigation Animation	😥
04	Hidden Search Widget	👌
05	Blurry Loading	👌
06	Scroll Animation	😥
07	Split Landing Page	😥
08	Form Wave	👌
09	Sound Board	😥
10	Dad Jokes	👌
11	Event Keycodes	👌
12	Faq Collapse	👌
13	Random Choice Picker	😥
14	Animated Navigation	👌
15	Incrementing Counter	👌
16	Drink Water	👌
17	Movie App	👌
18	Background Slider	👌
19	Theme Clock	😥
20	Button Ripple Effect	👌
21	Drag N Drop	👌
22	Drawing App	👌
23	Kinetic Loader	👌
24	Content Placeholder	👌
25	Sticky Navbar	😥
26	Double Vertical Slider	👌
27	Toast Notification	😥
28	Github Profiles	👌
29	Double Click Heart	👌
30	Auto Text Effect	👌
31	Password Generator	😥
32	Good Cheap Fast	👌
33	Notes App	😥
34	Animated Countdown	👌
35	Image Carousel	👌
36	Hoverboard	👌
37	Pokedex	😥
38	Mobile Tab Navigation	👌
39	Password Strength Background	😥
40	3d Background Boxes	😥
41	Verify Account Ui	😥
42	Live User Filter	👌
43	Feedback Ui Design	👌
44	Custom Range Slider	👌
45	Netflix Mobile Navigation	👌
46	Quiz App	😥
47	Testimonial Box Switcher	😥
48	Random Image Feed	😥
49	Todo List	😥
50	Insect Catch Game	😥