How to use Next.js with other frameworks and tools ft Tim Neutkens | Prismic

almost 6 years agoOctober 9, 2019
7:20
953 views
21 likes
P

Prismic

Channel

Interviewed Person

Tim Neutkens

Description

Tim Neutkens explained to use how to use Next.js with other frameworks and tools and gives us some tips on how to use Next.js. The things people use Next.js with: - There exist over 190 examples of implementations of Next.js with other tools - Next.js is not opinionated on the tools you should be using - If you are just starting, on nextjs.org, you have a Learn section that allows to get started easily (without even knowing React) --- As a developer, you should build websites using your favorite Jamstack framework. Prismic allows you to build website sections, that you can connect to a website builder for your client or team. They will create pages from there and you get that content back to your code through our fast API. ► [Tutorial] Build a full website with Next.js 13, Prismic, Tailwind and Typescript: https://youtu.be/nfZu56KsK_Q ► [Tutorial] Build a full website with Nuxt 3 and Prismic's new Page Builder: https://youtu.be/8GmfcbuYOWE ► [Starters] Try Slice Machine on Nuxt: https://prismic.club/nuxt-starters ► [Starters] Try Slice Machine on Next.js: https://prismic.club/nextjs-starters ► [Learn more about Slice Machine]: https://prismic.club/slice-machine --- ► Find us also on: Twitter: https://twitter.com/prismicio Instagram: https://www.instagram.com/prismicio LinkedIn: https://www.linkedin.com/company/prismic-io ► [Who are we?] : Prismic is a headless Website Builder, for Next.js and Nuxt.js developers. --- 00:00 Intro 00:45 What can be used with Next.js 03:16 What's hard with Next.js 04:46 Advise when using Next.js 05:18 Do you need to learn React? #Prismic #Next #WebDevelopment

Transcript

Group by:

- Tim, in the last two videos, we talked-- we introduced a bit how Next.js is as a good, a viable solution for building, websites and apps. And also we talked about the AMP rendering, - Right. - For having like more optimized rendering for search engines, and also for your websites for better experience

and more speed. And now, I would like to focus more on using Next with other things, other frameworks, - Right. - other things. Maybe like GraphQL, or you know, some people like - Right! - styled-components, can you tell us more about the things that people use Next with? - Right, so, we've seen many cases where people want to use like, one library or the other or like multiple different things. They might want to use Apollo for doing data fetching

using GraphQL, or they want to use Redux, styled-components for styling, specifically for styling we also include a library by default which is called styled-jsx. Which is another way to do styling in CSS, CSS in JS basically, and we have an examples directory, which has I think over 190 examples right now.

Which is, yeah, it's a crazy amount, but we all maintain them still - most is contributed by the community. - Yeah, most are contributed by the community, they are maintained by the community in many cases. For example, the Apollo example, when we accepted the Apollo example, I hadn't used Apollo before, so someone from the community actually, like went in there, like, created the example, we could review it, because it's code, of course, we can still review the code,

and see like, if the implementation is good and then like just merge them. - Right, so for instance, if I need to use GraphQL, then I would go to that sample of using Apollo and that would kind of inspire from it-- - Yes. - In a way. - Yeah, so you would end up like, copying the implementation and then you're also aware of like what it does exactly instead of like, having it in an abstracted way for example. - Right, okay. So, but you didn't--, you did--

in this matter, you don't take an opinion about that, if people want to use REST, - Yes. - You'll let them use REST, if they want to use Apollo, - Yup. - And GraphQL, that's their choice. - Yes, the only thing that we provide for data fetching is getInitialProps. And getInitialProps is just an asynchronous method so you can do like, anything that you want in there, basically, as long as it can be executed on the server and on the client site. Which means that it runs on your-- on the browsers of users basically also,

when you navigate between pages so, you can use like Apollo but you can also do just like fetch official, fetch standard and get some data from somewhere. - Right, and when people start with Next, what are the things that they kind of struggle the most with or what do they like spend their time in the beginning trying to understand? Are there like, this kind of things that you--

what kind of advise you can give them when they're starting with a Next app. - Really good question. (laughs) So, generally, what we do is we have an-- we actually have a website, on nextjs.org like the main website, there's a button called "Learn", and we have this amazing Learn section where you can do, like a guided tour through like everything that Next does, like all the features, it has like quizzes to revalidate like your knowledge, and you get like points,

15 segments (grouped from 170 original)1126 words~6 min readGrouped by 30s intervals

Video Details

Duration
7:20
Published
October 9, 2019
Channel
Prismic
Language
ENGLISH
Views
953
Likes
21

Related Videos