任何人都可以幸运地运行 firebase。我不断收到 Firebase 应用程序已初始化的错误。这和SSR有关系吗?每当进行硬刷新时,都会抛出此错误。我在文件中加载了我的 firebase 配置pages/index.js
,然后调用firebase.initializeApp(config)
.
[vercel/next.js]添加 firebase 示例
回答
@knipferrc 这个例子使用 firebase,它可能对你有帮助https://github.com/now-examples/next-news
@impronunciable也许我们应该添加一个firebase的例子,因为它是众所周知的?
是的,我仍然认为集中示例会很有帮助,现在它们有点分散:
- https://github.com/zeit/next.js/tree/master/examples
- https://github.com/now-examples/next-news
- https://github.com/zeit/nextgram
- ?
或者至少从一个地方将它们全部链接起来。
添加开源示例应用程序部分可能会很好。我知道您在关联.now.sh @sedubois 上做了很多工作,nextgram 是官方示例应用程序,next-news 是 @rauchg 的一个副项目,它是生产应用程序的一个非常好的示例?我制作了下一集,这也是一个小示例应用程序。
哦,是的,本期还列出了示例:https://github.com/zeit/next.js/issues/727
@rauchg @nkzawa @arunoda 您对添加开源项目部分有何看法?
@timneutkens 我认为如果我们将它们保存在 wiki 或awesome-nextjs
列表中会更好。顺便说一句:这里已经有一个很棒的 next.js 列表:https://github.com/unicodeveloper/awesome-nextjs
也许我们可以从自述文件中链接到该列表。 (最好在自述文件的顶部进行)
@arunoda 啊,好主意。我不知道有人已经列出了一份很棒的清单吗?会添加的。
我认为,为了使 nextjs 对 Web 开发新手更具吸引力,最好包含一些有关如何连接和使用数据库的示例和简短教程。如何使用 nextjs 创建实时应用程序?
@arashsa我觉得示例的问题在于,它们必须得到维护,并且示例越多,它们最终在主存储库中过时的可能性就越大(例如,至少 mobx 和 redux 不起作用自动取款机)。我觉得 wiki 列表是更好的方法,因为您可以简单地删除和添加指向良好维护示例的链接,并将维护工作委托给存储库所有者。
@knipferrc 我目前正在制作一个简短的 firebase+next.js 教程系列:https://blog.mvp-space.com/next-js-meets-firebase-and-mobx-ii-f89a6bbe7521#.5uw4ar4x8随意检查一下(到目前为止,这只是身份验证 - 周一将添加数据订阅部分)。
刚刚添加了 pr #1476,很好奇你们对我的方法有何看法。我是 Firebase 的新手,所以我可能会错过一些东西。
我在另一期中发布了此内容,但也在此处发布 - 我还有一个 firebase+next.js 示例,它在服务器上使用 firebase-admin 。它在服务器和客户端上呈现 firebase 数据。下一个例子
如何部署到 firebase?
@rebelliard 你是否设法将其部署到 firebase ?您是否在 .next 文件夹中初始化 firebase 项目,并选择“dist”文件夹作为您的构建?
过去一个月左右,我一直在为Firebase 上托管的Next.js 开发解决方案。我遇到一些问题阻止我更快地发帖。这是我的解决方案https://github.com/jthegedus/firebase-functions-next-example以及随附的博客文章(作为我的系列的一部分),解释了我如何让这一切正常工作。我得到了 @geovanisouza92 的帮助,并在上个月末在这里合作了部分解决方案serverless-firebase
还有更多 Next.js + Firebase 的示例吗?最好使用 Redux?
我尝试过将 Next.js 与react-redux-firebase和react-rebase一起使用,但我认为两者都需要认真修改才能使用Next.js。
Next-News示例在结构上感觉有点冗长,如果有一个框架就更好了。
我发现这个教程使用 Next.js + Firebase + Mobx:https://blog.mvp-space.com/next-js-meets-firebase-and-mobx-b3ae90d5b879(注:系列文章)。
@tomsoderlund 正如我在 Firebase Hosting 托管的 Next.js 中发现的那样,让示例足够小以易于理解并同时证明这一点是很困难的。使用 Redux、Firebase 和 Next.js 制作一个结构不冗长的示例将会很困难。理解这样的例子中所发生的事情的各个方面所需的知识将是相当高的。通过编写您从每个单独的示例中找到的内容来亲自实现它们,将使您完全了解它们如何协同工作以及您想要的结构。由于我个人正在走 Firebase、GraphQL、Next.js 和 Apollo 途径,因此我不会实现您在任何示例中提到的库。
这是一个旧的示例,我可以找到将 Redux 与 Firebase 结合使用 - https://medium.com/@prescottprue/firebase-with-redux-82d04f8675b9
@jthegedus 谢谢!
不过,您提到的文章没有使用 Next.js。我在使用react-redux-firebase 时没有遇到任何问题,在使用create-react-app 时也没有遇到react-rebase 问题,但是在与Next.js 一起使用时,我遇到了与Firebase 相关的奇怪错误。
PS Apollo看起来很令人兴奋,谢谢你的提示!请分享您用它创建的任何示例。
我的Next.js 与 Firebase 托管文章可能会涵盖您在使用 Next.js 时遇到的一些问题。
@jthegedus 谢谢!
我使用next.js、firebase 和 redux制作了一个示例项目。认为这可能会帮助其他人开始。如有任何反馈,我们将不胜感激。