Skip to content
/ AWP Public

learning more about react, webpack and embedding icons and emojis

Notifications You must be signed in to change notification settings

dcbasham/AWP

Repository files navigation

Project Video:

https://youtu.be/rzGR2d5Oa5M

Project

  • Color Picker component and front end frameworks

My learning objectives

-creating projects from scratch in vsCode, trying to use memory. -creating projects with create-react-app -using @mui library -creating webpack config and using webpack-dev-server. -using codeSandbox

What I did/ learned

--more experience setting up .eslintrc.json files for projects being compiled by webpack/babel

-modern React usage and the transition to functional components, focusing on making my components more concise and using Hooks. I've mostly acclimated myself with the useState() hook and not manually setting state values.

-For this repo, in the process of codeSandboxing a ColorPicker component, and transitioning it into this project I found a color picking library I took advantage of : @uiw/react-color. https://uiwjs.github.io/react-color/#/

although i do enjoy learning by doing I learned the value of:

-- starting from scratch isn't always the best course- it's definently easier and more time-conscious to start with something that is already functional and tweak it to suit my purposes. AND -using codeSandbox to test ideas instead of testing code in vsCode and having to setup an entire project, server etc. and look at it in the browser. -- writing tests before writing code is very important and will actually help me write better code by having a clear direction and expected outcome.! I'd like to focus more on that next.

book where I got the colorizer inspiration from: https://www.amazon.com/Learning-React-Hands-Building-Applications-dp-013484355X/dp/013484355X/ref=dp_ob_title_bk

example:

https://www.kirupa.com/react/examples/colorizer.htm

other sites:

https://uiwjs.github.io/react-color/#/sketch

emoji file: https://medium.com/@seanmcp/%EF%B8%8F-how-to-use-emojis-in-react-d23bbf608bf7

About

learning more about react, webpack and embedding icons and emojis

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published