Daryl Comments - Answer Overflow

Daryl

•Created by kikuti on 11/7/2024 in #front-end

Sidebar sidebar like explorer

Hi! I saw the React tag on your question, so I recommend trying to use this component: https://magicui.design/docs/components/file-tree

20 replies

KPCKevin Powell - Community

•Created by tejveer on 7/23/2024 in #front-end

Replicating Android Clock

It's plain JS, so it shouldn't be a problem using react. They even provide a hook to simplify some patterns: https://gsap.com/resources/React/

4 replies

KPCKevin Powell - Community

•Created by tejveer on 7/23/2024 in #front-end

Replicating Android Clock

Hi! I think the way to implement this is close to this example: https://codepen.io/supah/pen/jOZezwa The library used is GSAP, in particular their ScrollTrigger: https://gsap.com/docs/v3/Plugins/ScrollTrigger/?page=1

4 replies

KPCKevin Powell - Community

•Created by Y483R on 7/13/2024 in #front-end

How to Develop a Google Docs-like Text Editor in React with Real-time Collaboration and ImageResize?

Example for real-time collaboration: https://www.blocknotejs.org/examples/collaboration/partykit

4 replies

KPCKevin Powell - Community

•Created by Y483R on 7/13/2024 in #front-end

How to Develop a Google Docs-like Text Editor in React with Real-time Collaboration and ImageResize?

I think this is close: https://www.blocknotejs.org/.

4 replies

KPCKevin Powell - Community

•Created by Nibelung Valesti on 6/5/2024 in #front-end

Is it good practice to combine MUI and Tailwind css?

I suggest Shadcn: https://ui.shadcn.com/ Ready to use components that you can customize to your needs. About the icons, I think these are great options: * https://lucide.dev/icons/ * https://heroicons.com/

16 replies

KPCKevin Powell - Community

•Created by Lloyd Peterson on 5/20/2024 in #front-end

Vertical Carousel Animation

I think this library solves a lot of things: https://www.embla-carousel.com/ Examples: * Loop: https://www.embla-carousel.com/examples/predefined/#loop * Vertical: https://www.embla-carousel.com/examples/predefined/#y-axis

9 replies

KPCKevin Powell - Community

•Created by Israr on 5/3/2024 in #front-end

Read more content to popup

Are you looking for this? https://vaul.emilkowal.ski/

66 replies

KPCKevin Powell - Community

•Created by Pat66 on 3/31/2024 in #front-end

Lenis animation

The project and website are open source. The relevant parts are listed below: - html fragment: https://github.com/darkroomengineering/lenis/blob/main/website%2Fpages%2Fhome%2Findex.js#L403 - css: https://github.com/darkroomengineering/lenis/blob/main/website%2Fpages%2Fhome%2Fhome.module.scss#L410 - update zoom: https://github.com/darkroomengineering/lenis/blob/main/website%2Fpages%2Fhome%2Findex.js#L113

3 replies

KPCKevin Powell - Community

•Created by 🜲 ɢʀᴀɴᴛ on 3/23/2024 in #front-end

Swing Animation

Probably it's not what you are looking for, but I think it's worth to share: https://webglfundamentals.org/webgl/lessons/webgl-qna-drawing-2d-image-with-depth-map-to-achieve-pseudo-3d-effect.html

30 replies

KPCKevin Powell - Community

•Created by Fourth_quarter on 3/19/2024 in #front-end

Anyone know how to use yarn generate for react components? My Google search is burning time. Thanks

I'm not sure what is the requirement: Do you only want to create a component? Do you have to use a generator? To create a component you can simply create a .jsx or .tsx file, create a function and return JSX:

// your-file.jsx

const YourComponent = () => {
  ...extra stuff

   return <p>It works.</p>
}

// your-file.jsx

const YourComponent = () => {
  ...extra stuff

   return <p>It works.</p>
}

2 replies

TTCTheo's Typesafe Cult

•Created by Noor on 3/2/2024 in #questions

Best Chart/Graphs React Library

More alternatives: * easy to start with: https://www.tremor.so/components * cool but not that easy: https://airbnb.io/visx/gallery

7 replies

KPCKevin Powell - Community

•Created by ellemaker on 2/29/2024 in #front-end

Slider/Carousel

i think this is what you want: https://www.embla-carousel.com/examples/predefined/#scale

6 replies

KPCKevin Powell - Community

•Created by Matt on 2/3/2024 in #front-end

Carousel w/ JS

Hi @Matt! I want to encourage you to continue building your carousel, specially if it helps you to learn new stuff. But I also hope I can help you by recommending this great library: https://www.embla-carousel.com/get-started/

21 replies

TTCTheo's Typesafe Cult

•Created by Circus on 10/3/2023 in #questions

Shadcn components don't work out of the box?

I'm not sure what the issue might be, but the same code for the Calendar and the Date Picker works properly for the website (shadcn): * https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/example/date-picker-with-range.tsx * https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/ui/calendar.tsx Can you verify if the Tailwind classes are being applied correctly? Is your config setup properly? If everything should be fine, can you share a reproduction we can test on our end?

8 replies

TTCTheo's Typesafe Cult

•Created by Circus on 10/3/2023 in #questions

Shadcn components don't work out of the box?

Hi @Circus! Can you also share your code for the Calendar component?

8 replies

KPCKevin Powell - Community

•Created by Jimster on 10/2/2023 in #front-end

React Too Many Errors

If you want more information about this @Jimster, you can take a look to this article: https://overreacted.io/npm-audit-broken-by-design/#why-is-npm-audit-broken

122 replies

KPCKevin Powell - Community