Profile cover photo
Profile photo
Elijah Manor
11,825 followers -
Christian, Family Man, Developer
Christian, Family Man, Developer

11,825 followers
About
Posts

Post has attachment
Burke Holland invited me to be his guest on the "Five Things" show to review 5 Visual Studio Code extensions. He is a great host and a joy to be with.

https://www.youtube.com/watch?v=OzKk4Wfnz1k
Add a comment...

Post has attachment
🆕 Migrating from UNSAFE_ #ReactJS Lifecycle Hooks

📹 https://www.youtube.com/watch?v=G9S1IghlkCI

⚛️ In this video I take an example React app and migrate the UNSAFE_ lifecycle hooks to use safer alternatives

🗒 NOTE: You technically don't need to migrate yet. The original methods won't be deprecated until a v16.x release or removed until v17
Add a comment...

Post has attachment
📹 Rename Unsafe Lifecycle Hooks with react-codemod (6 mins) https://youtu.be/UqLh2K9j-wk

✅ Download react-codemod
✅ Learn jscodeshift options (dry run, print, etc…)
✅ Run rename-unsafe-lifecycles.js

🎉 Unsafe lifecycle hooks automatically prepended with `UNSAFE_`

⚛️ #reactjs
Add a comment...

Post has attachment
📹 Polyfill React 16.3 New Lifecycle Hooks (5 mins) https://youtu.be/djXh1vaDarg

✅ Import polyfill from react-lifecycles-compat
✅ Wrap your component with polyfill
✅ Export your polyfilled component

🎉 Backwards compat for getDerivedStateFromProps & getSnapshotBeforeUpdate
Add a comment...

Post has attachment
📹 What's New in #ReactJS 16.3 (15 mins) https://www.youtube.com/watch?v=WhWqy-vxKS8

✅ New Context API
✅ New getDerivedStateFromProps & getSnapshotBeforeUpdate lifecycle methods
✅ New react-codemod react-lifecycles-compat
✅ New ref APIs (createRef & forwardRef)
✅ New StrictMode & experimental AsyncMode components
✅ New React Dev Tools
Add a comment...

Post has attachment
Add ESLint & Prettier to @Code for a Create React App (8 mins) https://www.youtube.com/watch?v=bfyI9yl3qfE

✅ ESLint extension
✅ tweak .eslintrc
✅ Prettier extension
✅ npm i prettier eslint-config-prettier eslint-plugin-prettier -D
✅ tweak settings.json
✅ npm i husky pretty-quick

#reactjs
Add a comment...

Post has attachment
⚛️ Bootstrap a #ReactJS App with @Parceljs (5 mins) https://www.youtube.com/watch?v=ybjmUgKW3vU

✅ mkdir playground && cd $_
✅ npm init -y
✅ npm i parcel-bundler react react-dom
✅ touch index.{html,js}
✅ npx parcel index.html
✅ npx parcel build index.html --public-url ./
Add a comment...

Post has attachment
📹 Create React App: Part 4 - Forking instead of Ejecting (7min) https://youtu.be/I22TW-33dDE

⛔️ npm run eject
✅ fork create-react-app
✅ tweak webpack config & package.json
✅ npm publish --access public
✅ npx create-react-app playground --scripts-version @manorisms/react-scripts
Add a comment...

Post has attachment
📹 Create React App: Part 3 - Adding @Storybookjs Style Guide (6 mins)

🔗 https://www.youtube.com/watch?v=va-JzrmaiUM

✅ Generating Storybook
✅ Looking at the generated files
✅ Running in develop mode
✅ Adding a new Component story
✅ Building & serving locally

🏷 #reactjs
Add a comment...

Post has attachment
🔥 Detect and Refactor #JavaScript Copy-Paste Code (5 mins) https://www.youtube.com/watch?v=by1wSlYJe8s

✅ Run `jsinspect` or `jscpd` to detect copy-paste
✅ Ignore paths & adjust token thresholds
✅ Refactor duplicated code
✅ Rerun unit tests to verify code
✅ Verify duplication is gone & run app
Add a comment...
Wait while more posts are being loaded