Latest solutions
Password generator app | Vanilla TypeScript without any library
#accessibility#bem#typescript#vite#jestSubmitted almost 2 years agoREST Countries | React, React Router and Tailwind CSS
#accessibility#react#react-router#tailwind-css#fetchSubmitted over 2 years agoProduct preview | Reusable custom HTML Element with Web Components
#accessibility#bem#parcel#jestSubmitted almost 3 years agoPricing component | React, Framer Motion, Tailwind CSS
#framer-motion#react#styled-components#tailwind-css#viteSubmitted almost 3 years agoMobile first with React.js, Framer Motion and Tailwind CSS
#accessibility#framer-motion#react#tailwind-css#viteSubmitted almost 3 years agoScoot multipage website | React, Framer Motion, Tailwind CSS
#accessibility#framer-motion#react#tailwind-css#viteSubmitted over 2 years ago
Latest comments
- @leoikeh99@GrzywN
Great job!
I would suggest querying all the elements first and then passing them as function parameters. Then you can use the same elements and it is not necessary to query them again. This is generally considered a good practice.
It is also better to avoid complicated regular expressions, as they almost always do not work as intended. I would suggest using one of the popular npm libraries in this case.
Keep coding and have a nice day!
- @rakibhossainraju@GrzywN
Hey Kira!
Things worth considering:
- Adding ESLint and Prettier to your project to make code practices and formatting consistent
- Splitting big components into smaller ones
- Extracting app logic into utils and hooks (like calculating relative dates etc.)
Have a nice day and keep coding!
- @darryncodes
E-commerce product page - Tailwind CSS, React, Framer Motion & Vite
#accessibility#framer-motion#react#tailwind-css#vite@GrzywNGreat job @darryncodes!
I think you should consider changing '+' and '-' buttons, since they are really hard to click, especially on mobile. Try to focus them with the 'tab' key and you'll see.
Helpful materials for you:
- https://nerdcave.com/tailwind-cheat-sheet
- https://atomicdesign.bradfrost.com/chapter-2/
- https://blog.logrocket.com/using-prettier-eslint-automate-formatting-fixing-javascript/
- https://www.npmjs.com/package/prettier-plugin-organize-imports
Have a nice day and keep coding!
Marked as helpful - @abedfetrat@GrzywN
Add
no-cache
, when using fetch. It doesn't work properly on Firefox. For example:const response = await fetch("https://api.adviceslip.com/advice", { cache: "no-cache", });
Have a nice day! 😄
Marked as helpful - @Bayoumi-dev
Single-page dev portfolio using HTML5, CSS3, Bootstrap5, JS, Webpack5
#accessibility#animation#bootstrap#webpack@GrzywNI can't access your repo ;(. It's probably still private
- @Bayoumi-dev
Dine restaurant website using React js with Typescript and Tailwindcss
#accessibility#react#react-router#typescript#tailwind-css@GrzywNi love it, great job