[vercel/next.js]添加 firebase 示例

2024-05-15 408 views
9

任何人都可以幸运地运行 firebase。我不断收到 Firebase 应用程序已初始化的错误。这和SSR有关系吗?每当进行硬刷新时,都会抛出此错误。我在文件中加载了我的 firebase 配置pages/index.js,然后调用firebase.initializeApp(config).

回答

6

@impronunciable也许我们应该添加一个firebase的例子,因为它是众所周知的?

7

添加开源示例应用程序部分可能会很好。我知道您在关联.now.sh @sedubois 上做了很多工作,nextgram 是官方示例应用程序,next-news 是 @rauchg 的一个副项目,它是生产应用程序的一个非常好的示例?我制作了下一集,这也是一个小示例应用程序。

0

@rauchg @nkzawa @arunoda 您对添加开源项目部分有何看法?

4

@timneutkens 我认为如果我们将它们保存在 wiki 或awesome-nextjs列表中会更好。顺便说一句:这里已经有一个很棒的 next.js 列表:https://github.com/unicodeveloper/awesome-nextjs

也许我们可以从自述文件中链接到该列表。 (最好在自述文件的顶部进行)

4

@arunoda 啊,好主意。我不知道有人已经列出了一份很棒的清单吗?会添加的。

6

我认为,为了使 nextjs 对 Web 开发新手更具吸引力,最好包含一些有关如何连接和使用数据库的示例和简短教程。如何使用 nextjs 创建实时应用程序?

9

@arashsa我觉得示例的问题在于,它们必须得到维护,并且示例越多,它们最终在主存储库中过时的可能性就越大(例如,至少 mobx 和 redux 不起作用自动取款机)。我觉得 wiki 列表是更好的方法,因为您可以简单地删除和添加指向良好维护示例的链接,并将维护工作委托给存储库所有者。

@knipferrc 我目前正在制作一个简短的 firebase+next.js 教程系列:https://blog.mvp-space.com/next-js-meets-firebase-and-mobx-ii-f89a6bbe7521#.5uw4ar4x8随意检查一下(到目前为止,这只是身份验证 - 周一将添加数据订阅部分)。

4

刚刚添加了 pr #1476,很好奇你们对我的方法有何看法。我是 Firebase 的新手,所以我可能会错过一些东西。

0

我在另一期中发布了此内容,但也在此处发布 - 我还有一个 firebase+next.js 示例,它在服务器上使用 firebase-admin 。它在服务器和客户端上呈现 firebase 数据。下一个例子

7

如何部署到 firebase?

5

@rebelliard 你是否设法将其部署到 firebase ?您是否在 .next 文件夹中初始化 firebase 项目,并选择“dist”文件夹作为您的构建?

3

@tomsoderlund 正如我在 Firebase Hosting 托管的 Next.js 中发现的那样,让示例足够小以易于理解并同时证明这一点是很困难的。使用 Redux、Firebase 和 Next.js 制作一个结构不冗长的示例将会很困难。理解这样的例子中所发生的事情的各个方面所需的知识将是相当高的。通过编写您从每个单独的示例中找到的内容来亲自实现它们,将使您完全了解它们如何协同工作以及您想要的结构。由于我个人正在走 Firebase、GraphQL、Next.js 和 Apollo 途径,因此我不会实现您在任何示例中提到的库。

这是一个旧的示例,我可以找到将 Redux 与 Firebase 结合使用 - https://medium.com/@prescottprue/firebase-with-redux-82d04f8675b9

8

@jthegedus 谢谢!

不过,您提到的文章没有使用 Next.js。我在使用react-redux-firebase 时没有遇到任何问题,在使用create-react-app 时也没有遇到react-rebase 问题,但是在与Next.js 一起使用时,我遇到了与Firebase 相关的奇怪错误。

PS Apollo看起来很令人兴奋,谢谢你的提示!请分享您用它创建的任何示例。

7

@jthegedus 谢谢!

4

我使用next.js、firebase 和 redux制作了一个示例项目。认为这可能会帮助其他人开始。如有任何反馈,我们将不胜感激。