首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

有同学问了我一个很多前端都在担忧的问题

如图,这是今天一个先行者计划的成员,在同我聊天的时候提到的问题。这个问题确实是客观存在的,前端变化快,一会今天这个了,一会明天又那个了。...“我都有点动摇了,我原来还总鼓励他们别放弃,搞一阵之后自己也有想法了” 我在微信是这样回复他的, 其实你细看,前端变的都是上层建筑,什么vue啊,react啊,这那的,,但这些框架都是对原生js的再封装...只要你原生 js很ok,那么你学习新框架是很快的。就例如我,我原生 js很ok,所以我学什么新的框架,都很快。一个新框架出来,无非是一套新js语法而已,核心还是那些。...前端无论怎么变,永远只有一个js,其它的那些东西,都是在js的基础之上,再封装。jq解决dom兼容性,vue,react解决dom操作,但根上呢?...后端有后端的好处,学会一个j2ee可以吃很多年。但前端最大的优势在于,只要你比别人快,你就会有很大的优势。 这一点就如同现在的中国,唯一不变的就是变化。

1.1K80

React Query 指南,目前火热的状态管理库!

isFetching 标志表示有一个挂起的请求,如果应用程序请求下一个信息,这是非常完美的。 error:此对象包含请求存在问题的错误;通过使用它,你可以获取错误并为用户创建漂亮的信息提示。...好的,你现在对 useQuery 的工作方式及其潜力有了一个概念,但是如果你更有兴趣,可以观看我的视频了解更多信息。 好的,就这些!我很快会回到你呈现 React Query 的另一个功能。...我想你已经对如何使用 useMutation 和 useQueryClient 有了一个概念,但是如果你想深入了解它们,请别忘了看我的 Youtube 视频。...如果一切正常,onSuccess hook 调用导航到主页;否则,onError hook 显示一个错误的提示。 在代码中,有一个 TODO 表示缺失的内容;我们将在此后的文章中回到这行代码。...好的,完美。现在您已具备使用 React Query 构建身份验证流程的所有知识!

4.2K42
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    React Router入门指南(包括Router Hooks)

    在本教程中,我将介绍使用React Router入门所需的一切。...以编程方式导航 我们收到的props有一些便捷的方法可用于在页面之间导航。...现在,让我们继续前进,并在下一部分中学习如何保护我们的路由。 保护路由 有很多方法可以保护通往React的路由。但是,在这里,我仅检查用户是否已通过身份验证并将其重定向到适当的页面。...: } ); } 如您所见,我声明了一个模仿身份验证的变量...然后,检查用户是否已通过身份验证。如果是这种情况,请渲染受保护的页面,否则将其重定向到主页。 到目前为止,我们已经介绍了很多内容,但是它仍然是一个有趣的部分:路由钩子Hooks。

    12K20

    使用React Router v6 进行身份验证完全指南

    本文将演示如何使用React Router v6创建受保护的路由以及如何添加身份验证。...创建受保护的路由 在创建受保护的路由之前,让我们先创建一个自定义钩子,它将使用Context API和useContext钩子处理通过身份验证的用户的状态。...如果喜欢这篇文章,关注一下鼓励我继续创作吧~❤️ 使用嵌套路由和 React Router v6中最强大的特性之一是嵌套路由。这个特性允许我们有一个包含其他子路由的路由。...例如,在 组件中,我们已经包含了私有路由逻辑和一个通用导航条,当子路由被呈现时,它将是可见的。...我希望本指南对您有所帮助,希望您对如何使用React Router v6处理用户身份验证有了更好的理解。

    14.7K41

    『React Navigation 3x系列教程』createSwitchNavigator开发指南

    【案例1】使用createSwitchNavigator进行登录场景的跳转 多数应用程序都要求用户通过某种方式进行身份验证才能访问与用户或其他私人内容相关的数据。...通常情况下,流程如下所示: 用户打开应用。 该应用程序从持久存储中加载某个身份验证状态(例如,AsyncStorage)。 当状态被加载时,根据是否加载有效的认证状态,向用户呈现认证页面或主页面。...注意:我们说“认证页面”,因为通常有不止一个。 您可能会有一个主页面,其中包含用户名和密码字段,一个用于“忘记密码”的页面,一个用于注册的页面。 ?...第一步:创建一个createSwitchNavigator类型的导航器 const AppStack = createStackNavigator({ Home: { screen...,大家可以通过与本课程配套的实战课程进行进一步学习react-navigation的高级应用。

    2.6K10

    区块链一键登录:MetaMask教程(One-click Login with Blockchain: A MetaMask Tutorial)

    社交媒体登录整合的缺点: 由于用户的信息是从外部提供商加载的,这就提供了一个关于提供商如何使用所有这些个人数据的巨大隐私问题。例如,在撰写本文时,Facebook正面临数据隐私问题。...让我们一起建设吧 在本节中,我将逐一完成上述六个步骤。我将展示一些关于如何从零开始构建登录流的代码片段,或者将它集成到现有的后端,而不需要太多的努力。 为了本文的目的,我创建了一个小型演示应用程序。...,就像在步骤4的前端中一样,此用户的随机数。 下一个块是验证本身。有一些密码学涉及。如果您觉得冒险,我建议您阅读更多关于椭圆曲线签名的内容。...关于移动应用程序,答案是肯定的,登录流程正常,但准备工作有很多基础。基本上,你需要自己重建一个简单的以太坊钱包。...如果您有任何问题,请随时联系下面的评论。 关于作者 Amaury拥有五年以上构建全栈网络和移动应用程序(Node.js,React,React Native)的经验。

    7.9K21

    我是如何成功搭建 express+mongodb 的简洁博客网站后端的

    后端 1.1 已经实现功能 √登录 √文章管理 √标签管理 √评论 √留言管理 √用户管理 √友情链接管理 √时间轴管理 √身份验证 1.2 待实现功能 x点赞、留言和评论 的通知管理 x个人中心(用来设置博主的各种信息...注意点 文章是分类型的:文章类型 => 1: 普通文章,2: 简历,3: 管理员介绍;而且简历和管理员介绍的文章只能是各自一篇(因为前台展示那里有个导航 关于我 ,就是请求管理员介绍这篇文章的,简历也是打算这样子用的...评论是有状态的:状态 => 0 待审核 / 1 通过正常 / -1 已删除 / -2 垃圾评论。...的 blog-react 项目文档说明 3....基于 node + express + mongodb 的 blog-node 项目文档说明 4. 服务器小白的我,是如何将node+mongodb项目部署在服务器上并进行性能优化的 9.

    96830

    SPA 和 React:你并不总是需要服务器端渲染

    虽然有很多应用确实需要服务器端渲染,但是也有不少的应用并不需要服务器端渲染。如果选择 SSR React 框架,可能会引发新的问题而不是解决问题。 什么是 SPA?...当导航至一个新路由时,React 会接管并用 HTML 和通常通过客户端 HTTP 请求获取到的数据为“页面”填充内容。 什么是 SSR? SSR 应用与之不同。...SPA 有哪些问题?...一个反复出现的问题就是“无休无止的加载器(spinner-geddon)”,每当导航到一个新的“页面”时,都会出现一个加载器动画,表示正在加载数据,只有在成功完成 HTTP 请求后,页面才会充满内容。...我认为是这样的,有很多内部应用永远不会与外部世界接触,也不需要由 React 驱动的更现代的 SSR 框架所提供的任何功能。

    46430

    SPA和React: 并不总是需要服务器端渲染

    选择一个SSR React框架有可能制造问题而不是解决问题。 什么是SPA? 顾名思义,SPA只有一个页面。SPA可能有导航功能,但是当您从“页面”跳转到“页面”时,您体验的是路由,而不是页面。...当您导航到一个新的路由时,React接管并使用客户端HTTP请求获取的HTML和(通常是)数据来“激活”“页面”。 什么是SSR? 与SPA不同,服务器端渲染的应用程序确实有页面。...SPA存在的问题 反复出现的一个问题是“spinner-geddon”;每次您导航到一个新的“页面”时,都会显示一个加载动画来指示正在请求数据,只有在HTTP请求成功完成后,页面才会用内容进行渲染。...我构建的应用程序约需8周完成,仅使用客户端HTTP请求从API获取数据,具有身份验证功能,使用现有的Azure DevOps管道进行了部署,并且没有进行搜索引擎优化。...有许多内部应用程序永远不会面向公众,也不需要使用更现代的React驱动SSR框架提供的任何功能。但是由于React文档不再推荐CRA,如果今天要构建SPA,您还可以使用什么呢?

    15610

    构建具有用户身份认证的 React + Flux 应用程序

    这篇文章发表于 2016 年 5 月,我是去年读的本文,但迟迟没有翻译,而现在准备重新学习 React ,所以把这篇文章翻出来与大家共勉。...React 的生态系统很大,为了解决 React 中比较困难的问题,你可以选择多种模块。大多数实际的 React 应用程序都有一些共同的需求,这些需求主要包括状态管理及路由。...在 Scotch 上, Ken 有一些关于React 和 Flux 的 awesome series,当然,网上也有很多关于这些话题的教程。...总结 如果你跟着本教程做完,现在你已经有了一个 React + Flux 的应用,它调用 API 获取数据以及使用 Auth0 完成用户身份认证。非常棒!...当应用程序变得越来越大时,有必要消除双向绑定带来的困惑。 幸运的是,令人棘手的身份验证部分使用 Auth0 来做非常简单。

    11.6K00

    构建具有用户身份认证的 React + Flux 应用程序

    这篇文章发表于 2016 年 5 月,我是去年读的本文,但迟迟没有翻译,而现在准备重新学习 React ,所以把这篇文章翻出来与大家共勉。 ?...React 的生态系统很大,为了解决 React 中比较困难的问题,你可以选择多种模块。大多数实际的 React 应用程序都有一些共同的需求,这些需求主要包括状态管理及路由。...在 Scotch 上, Ken 有一些关于React 和 Flux 的 awesome series,当然,网上也有很多关于这些话题的教程。...总结 如果你跟着本教程做完,现在你已经有了一个 React + Flux 的应用,它调用 API 获取数据以及使用 Auth0 完成用户身份认证。非常棒!...当应用程序变得越来越大时,有必要消除双向绑定带来的困惑。 幸运的是,令人棘手的身份验证部分使用 Auth0 来做非常简单。

    11K70

    前端使用puppeteer 爬虫生成《React.js 小书》PDF并合并

    小书》简介 《 React.js小书》简介 关于作者@胡子大哈 这是⼀本关于 React.js 的⼩书。...1、打开浏览器,进入目录页,生成 0.React小书目录.pdf 2、跳转到 1.React.js简介页面,获取左侧所有的导航 a链接的 href,标题。...生成这些后,那么问题来了,就是查看时总不能看一小节,打开一小节来看,这样很不方便。 于是接下来就是合并这些 pdf成为一个 pdf文件。...3、合并成一个PDF文件 pdf-merge 起初,我是使用在线网站Smallpdf,合并 PDF。合并的效果还是很不错的。这网站还是其他功能。比如 word转 pdf等。...github下载链接:React小书(完整版)-作者:胡子大哈。 本想着还可以加下书签和页码,没找到合适的生成方案,那暂时先不加了。如果读者有好的方案,欢迎与笔者交流。

    2.7K20

    如何为React Native应用插桩以发送OTel信号

    Native 应用添加监控功能,以便通过 OTLP-HTTP 将数据发送到任何 OpenTelemetry 后端,包括自动监控、自定义追踪和导航流程追踪。...这使其能够发出关于在移动应用中运行的原生代码中发生的崩溃、内存问题等的遥测数据。换句话说,您可以通过访问来自原生层和 JS 层的上下文来更好地了解移动应用问题。...Embrace 有一个 包 提供了此常见用例的检测。...,屏幕如下所示: 此示例使用该包显示了一个非常简单的导航流程,该流程在主页和详细信息屏幕之间进行,但也支持包 @react-navigation/native (https://www.npmjs.com...它是一个独立的包,它生成关于导航流的遥测数据,并且它会在正确的时间自动启动和结束跨度,并带有相应的上下文。您可以深入了解我们如何构建它。 此检测库由Embrace公开,但它并不局限于我们的产品。

    6200

    为什么用 React 一定要配合框架(Next,Remix)使用?

    Hi,大家好我是 ssh,今天我看到 Leerob 分享的 Why You Should Use a React Framework,讲述了他关于为什么要使用 React 框架(如 Next,Remix...正巧我在知乎上也看到有人有相关的疑惑,底下的讨论还挺激烈,有兴趣的话也可以去看看: 为什么 react 官网推荐使用 create-next-app 了呢?...下面,我就来和大家分享一下 Leerob 的一些看法: 分析互联网上前 10,000 个公开可访问的网站时,我们看到了一个有趣的趋势:现在约有 6% 的网站采用 React 框架 ¹。...过度讨论是有害的 选择 React 只是众多前端架构选择中的一个决策。 你可能还需要考虑以下问题: 我们应该如何处理路由?...(例如 CSS 模块、Tailwind CSS 等) 我们应该如何处理身份验证? 框架为你做出了许多这些决策,并为你提供了在 Web 上解决常见问题的工具和组件。

    93240

    打造属于自己的博客app——基于react native和博客园接口

    关注react native这个技术很久了,去年就做了一个简单的Demo,最近有时间,重新了解了一下react native的现状,发现已经有很大的进步,现在完善了一下原有的项目,并重新开源共享一下。...一年过去,现在重新开始关注react native,发现react native已经将原有的很多问题解决,相比当年版本,有太多的进步。现在将原有项目重构并重新发布到github。...之前版本的react native 的页面导航没有一个很好的解决方案,最大的问题就是页面切换的卡顿,很多第三方的导航组件使用起来性能更差,还不如自己开发。...实际使用和最终的理想还是有差距的,最后我还是选择了webview渲染html的方案。...后期计划 因时间有限,所有在UI上不会做太多的调整,这也不是我擅长的,关于功能会进行逐步完善: 增加新闻模块 增加评论浏览和评论功能 增加博客园首页和精华 完善个人中心以及相关设置 曾经考虑过做成多个站点聚合数据的形式

    1.3K50

    Web 应用开发进化论

    为了开发一个服务器,你也可以在本地计算机上拥有一个服务器(localhost)。 ---- Web 服务器和应用服务器有啥区别?...例如,当用户通过浏览器中的 /about 路径(也称为页面或路由)访问一个网站时,例如 http://www.conardli.top/about, Web 服务器将关于这个 URL 的所有信息发送回浏览器...身份验证、授权和数据库的一切都为你完成。此外,大多数 BaaS 也提供托管服务,例如,你的 React 应用程序也可以使用 Firebase 托管。...Firebase 会将你的 React 应用程序提供给你的客户端(浏览器),并让你的应用程序可以使用所有其他的功能(例如身份验证、数据库)。...当用户从一个页面导航到另一个页面时,只有一小部分服务器端渲染的 React 被发送到浏览器。

    4.2K10

    8 款好用的 React Admin 管理后台模板推荐

    图片本文提到的 React Admin 管理后台模板价格几乎都超过了 20 美元(一个 9 美元的除外)。...虽然 Material Dashboard React 付费版中有 200 个 UI 组件和 8 个应用程序模版,但其免费版本仍提供有 30 个 UI 组件和 7 个样本应用程序,相信应付日常需求完全没问题...Wieldy: Best for easily customized layouts图片React Admin 管理后台模板有多种布局选择,但大多数只是意味着将导航面板放在左边或右边。...Fuse: Best for Oms/Ecommerce图片本文提到的 React 模板中,每一个都包含有一个电子商务的模板,但 Fuse 为用户提供了多个电子商务模板。...Dandelion Pro: 邮件模板图片Dandelion Pro 是唯一有电子邮件模板的 React Admin 管理后台模板。

    8.3K51
    领券