Leetcode for FrontEnd
Adapted from https://www.linkedin.com/feed/update/urn:li:activity:7330824884316504066/:
- Data structures: Arrays, Maps, Stacks, Trees, Sets
- HTML: Semantic HTML, Form validation, Form submission
- CSS: Box model, Selectors, Specificity, Positioning, Units, Flexbox, Grid, CSS custom properties (variables)
- JavaScript​: Closures, Callbacks, Promise, async/await, this keyword
- DOM: DOM traversal, DOM creation, DOM manipulation, Accessing element/node properties, Event delegation
- Runtime APIs: setTimeout(), setInterval(), fetch()
- Accessibility: ARIA roles, States & properties, Keyboard interactions
- React: useState, useEffect, Props vs State
| Topic | Description | Solution |
|---|---|---|
| Debounce | question | solution |
| Classnames | question | solution |
| Flatten | question | solution |
| Throttle | question | solution |
| Promise.all | question | solution |
| Deep Clone | question | solution |
| Event Emitter | question | solution |
| Map Async Limit | question | solution |
| Deep Equal | question | solution |
| Memoize | question | solution |
| Curry | question | solution |
| Topic | Description | Solution |
|---|---|---|
| Todo List | question | state reducer |
| Contact Form | question | solution |
| Job Board | question | solution |
| Accordion | question | solution |
| Image Carousel | question | solution |
| Data Table | question | solution |
| File Explorer | question | solution |
| Tic-tac-toe | question | solution |
| Nested Checkboxes | question | solution |
| Topic | Description | Solution |
|---|---|---|
| Invert Binary Tree | question | FE solution |
Run npm i to install dependencies.
Run: npx bun src/javascript/[question]/[question]-demo.ts
e.g.npx bun src/javascript/debounce/debounce-demo.ts
Run: npx vite src/react/[question]
e.g. npx vite src/react/data-table/
All tests: npm run test
JavaScript tests: npm run test:javascript
React tests: npm run test:react