Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Precedent – Building Blocks for Next.js

precedent.vercel.app

Post reply on HN
Print view View original

31–40 of 50 posts

Re: Precedent – Building Blocks for Next.js

#31

Post by moneywoes »

steventey wrote: post #26
moneywoes wrote: post #5

Looking to learn and build a react app, should I start with this? Did review some html css prior.

I highly recommend learning Next.js as a way to learn React – it is built on top of React and focuses on some of the most important hooks (useState, useEffect) while also giving you functions for server-side rendering that help make sure your app is performant from the get-go. That's actually how I learned React myself :) Disclaimer: I work at Vercel (we maintain Next.js)

Any courses you suggest? Was looking at frontend masters

Also tailwindui or mui or ant?

Re: Precedent – Building Blocks for Next.js

#32

Post by taspeotis »

AirMax98 wrote: post #22

2/3 of these components are broken on iOS safari. I also see some questionable things happening in the hooks that might not make it past a review. It's a good start, but definitely keep it up. [1] — https://github.com/steven-tey/precedent/blob/main/lib/hooks/... (you don't need the ref if you are ignoring exhaustive-deps, not sure why you stringify threshold) [2] - https://github.com/steven-tey/precedent/blob/main/li…

The front page is broken on Edge?

https://i.imgur.com/kNOcEtB.gif

Re: Precedent – Building Blocks for Next.js

#33

Post by searchableguy »

Alifatisk wrote: post #25

I love Vercels design, I remember reading on their discussion page that they were working on open-sourcing their components and design system, but that was about two years ago? Now the closest thing we have is geist-ui.dev

https://vercel.com/design/introduction

They hired evilrabbit and now show geist ui on their own site.

Re: Precedent – Building Blocks for Next.js

#34

Post by solarkraft »

I'm waiting for the UI library that also animates everything out that it animates in. I know why people don't do it (it's annoying to do in React), but this gross lack of attention to detail in even the biggest-name software really bothers me. The UX sucks. If you're not going to animate it out, just skip animating it in to at least be consistent!

This isn't meant to be a dig at this specific library* (it's certainly no worse than others and you probably did a great job!), but rather the general state of React UI development.

*however this library already uses Framer Motion, which makes such things much easier

Re: Precedent – Building Blocks for Next.js

#35

Post by ndstephens »

Curious why you went with RadixUI over HeadlessUI? Not that you shouldn't, just wondering what your decision process was.

I also noticed in `_app.tsx` that you wrapped in a element. Wouldn't that wrap the entire app within main tags? I think that kind of throws off the normal flow of accessible landmarks.

I really like the template so far. Might add a few aspects of it to my own. Thanks for sharing

Re: Precedent – Building Blocks for Next.js

#36

Post by steventey »

AirMax98 wrote: post #22

2/3 of these components are broken on iOS safari. I also see some questionable things happening in the hooks that might not make it past a review. It's a good start, but definitely keep it up. [1] — https://github.com/steven-tey/precedent/blob/main/lib/hooks/... (you don't need the ref if you are ignoring exhaustive-deps, not sure why you stringify threshold) [2] - https://github.com/steven-tey/precedent/blob/main/li…

The z-index issues with the components have been fixed: https://github.com/steven-tey/precedent/issues/2#issuecommen...

Appreciate the feedback about the functions – will get those fixed as well!

Re: Precedent – Building Blocks for Next.js

#37

Post by reducesuffering »

moneywoes wrote: post #31
steventey wrote: post #26

Earlier quoted context omitted.

I highly recommend learning Next.js as a way to learn React – it is built on top of React and focuses on some of the most important hooks (useState, useEffect) while also giving you functions for server-side rendering that help make sure your app is performant from the get-go. That's actually how I learned React myself :) Disclaimer: I work at Vercel (we maintain Next.js)

Any courses you suggest? Was looking at frontend masters Also tailwindui or mui or ant?

Do the official Next.js tutorial [0]. Tailwindcss yes, TailwindUI are paid components. Not mui.

[0] https://nextjs.org/learn/foundations/about-nextjs?utm_source...

Re: Precedent – Building Blocks for Next.js

#39

Post by steventey »

ndstephens wrote: post #35

Curious why you went with RadixUI over HeadlessUI? Not that you shouldn't, just wondering what your decision process was. I also noticed in `_app.tsx` that you wrapped in a element. Wouldn't that wrap the entire app within main tags? I think that kind of throws off the normal flow of accessible landmarks. I really like the template so far. Might add a few aspects of it to my own. Thanks for sharing

AFAIK Radix has better a11y support than HeadlessUI, which is why I went with that!

As for the second point – I'm actually not quite sure if there are any downsides/tradeoffs to that. What do you mean by accessible landmarks in this case? a11y?

Glad you like the template!

Post reply on HN