@react

動態 列表
@fantasticlbp

一個 Hybrid SDK 設計與實現

隨着移動浪潮的興起,各種 App 層出不窮,極速發展的業務拓展提升了團隊對開發效率的要求,這個時候純粹使用 Native 開發技術成本難免會更高一點。而 H5 的低成本、高效率、跨平台等特性馬上被利用起來了,形成一種新的開發模式: Hybrid App 作為一種混合開發的模式,Hybrid App 底層依賴於 Native 提供的容器(Webview),上層使用各種前端技術完成業務開發(現在三足鼎

fantasticlbp 頭像

@fantasticlbp

昵稱 杭城小劉

@windseek

RN中webview的一些思考

遇到的坑:webview和h5通信時,會有一些延遲導致不能立即生效 具體描述:在使用react-native時,需要加載外部網頁,加載後,RN提供一個按鈕可以關閉網頁,但如果打開的是內部網頁就需要隱藏這個按鈕,h5代碼使用react寫的,在componentDidMount時,發送postmessage給客户端(RN),此時發現收不到,查閲react-native官方文檔後得已解決。

windseek 頭像

@windseek

昵稱 楊龍飛

@liushuigs

用Node.js, React和Socket.io創建一個看板應用

本文為譯文,原文地址為: Building a Kanban board with Node.js, React and Websockets 關於 在這篇文章中,你可以學習如何構建一個看板應用,類似在JIRA, MonDay或者Trello等應用中看到那樣。這個應用,將包含一個漂亮的drag-and-drop功能,使用的技術是React, Socket.io和DND(拖拽)技術。用户可以登錄、創

liushuigs 頭像

@liushuigs

昵稱 jinling

@zzd41

使用 Socket.io 和 React 開發一個聊天應用

這篇文章是關於什麼的 相信大家對於 web 版的線上聊天室都不陌生,這篇文章主要講的就是如何使用 Socket.io 和 React 開發一下簡單的線上聊天應用。 所謂線上聊天應用,就是你給一個人或者一個羣發送一條消息,他們可以看到這條消息並且可以回覆。既簡單又複雜。 開發一個聊天室應用,你需要在新信息來到的時候及時的感知到。 通常來説,為了獲得服務端的信息,我們需要發送一個 HTTP 請求。但是

zzd41 頭像

@zzd41

昵稱 superZidan

@huolang_5a14e07d2f2ff

ES5和ES6函數你不知道的區別【面試篇】

前言 JS 中函數是高等公民,但是function 和 class 的區別你真的清楚嘛? 本文從PolyFill 實現,再到性能分析,再複習哈基礎篇的使用; 另外深圳前端求坑,有坑的大佬麻煩內推一下。 1. PolyFill 1.利用原生 js 擼一個簡單的 class; 2.根據上面的用法知道 class 必須通過 new 調用,不能直接調用; // 阻止直接()調用,

@infinilabs

如何實現一個充滿科技感的官網(二)

背景 在上一篇文章 《如何實現一個充滿科技感的官網(一)》 中,我們初步瞭解了該官網的整體設計,並與大家探討了它的視覺呈現和用户體驗。 我們前期的內部設計偏向簡潔,所以開始思考如何提升網站的整體設計感。這些嘗試便由此展開。 網站地址:https://infinilabs.com/ 如果你對動態背景的實現感興趣,這篇文章將帶你深入探索,揭秘如何從零打造一個兼具美感與功能性的企業官網! 技術選型

infinilabs 頭像

@infinilabs

昵稱 極限實驗室

@zxbing0066

React SSR - 寫個 Demo 一學就會

今天寫個小 Demo 來從頭實現一下 react 的 SSR,幫助理解 SSR 是如何實現的,有什麼細節。 什麼是 SSR SSR 即 Server Side Rendering 服務端渲染,是指將網頁內容在服務器端中生成併發送到瀏覽器的技術。相比於客户端渲染(CSR),SSR 一般用於以下場景: SEO (搜索引擎優化):由於部分搜索引擎對 CSR 內容支持不佳,所以 SSR 可以提升網站在

zxbing0066 頭像

@zxbing0066

昵稱 嘿嘿不務正業

@kanshouji

服務端渲染nextjs項目接入經驗總結

服務端渲染 nextjs@14 項目接入經驗總結,本文重點介紹基本知識點/常用的知識點/關鍵知識點 背景 為提高首屏渲染速度減少白屏時間提高用户體驗及豐富技術面,開始調研和接入nextjs框架 優勢 nextjs是一套成熟的同構框架(一套代碼能運行在服務端也能運行在瀏覽器)對比傳統的客户端渲染的核心優勢是首屏是帶數據的和減少跨域帶來的option請求。其它後續操作是一樣的。理論上能比客户端渲染看到

kanshouji 頭像

@kanshouji

昵稱 路邊縣

@invalidnull

關於 serve-static 的 index.d.ts 報錯的問題分析

理解這條日誌的含義,需要我們深入分析其組成部分和背後可能的原因。這條日誌信息顯然指向了一個 Node.js 項目中的一個具體錯誤,其指出了錯誤發生的文件路徑和具體位置。接下來,我將逐步解析這條日誌信息的各個方面,並解釋可能的原因和解決方法,同時遵守你的要求,使解析過程既詳細又不顯得機械。 日誌信息解析 2024-01-01 05:08:15,120 INFO d.h.c.h.PrintOutput

invalidnull 頭像

@invalidnull

昵稱 註銷

@jump_and_jump

讓 React 擁有更快的虛擬 DOM

Million.js 是一個非常快速和輕量級的 ( 4kb) 虛擬 DOM。框架可以通過包裝 React 組件來提升性能(該框架目前版本只兼容 React 18 及以上版本)。 先説結論:Million.js 適應的場景極其有限,但在特定場景下也大放異彩。 如何使用 Million.js 集成 React 中使用非常簡單。先進行安裝和編譯器配置。 安裝與配置 npm install million

jump_and_jump 頭像

@jump_and_jump

昵稱 jump__jump

@jdcdevloper

React請求機制優化思路 | 京東雲技術團隊

説起數據加載的機制,有一個繞不開的話題就是前端性能,很多電商門户的首頁其實都會做一些垂直的定製優化,比如讓請求在頁面最早加載,或者在前一個頁面就進行預加載等等。隨着react18的發佈,請求機制這一塊也是被不斷談起,並且在後續其實也給出了明確的方向。 假如我們頁面中有三個組件C1、C2、C3依次嵌套,每個組件中有對應的請求F1、F2、F3,通常大多數人會使用useeffect和state變量來實現

jdcdevloper 頭像

@jdcdevloper

昵稱 京東雲開發者

@refanbanzhang

flex佈局常見問題

flex無法創建滾動條 flex的孫元素使用overflow: auto無法出現滾動條 原因: 子元素沒有設置寬度,這會導致子元素的寬度由孫元素決定,從而子元素被撐大,孫元素無法達到出現滾動條的條件。 解決方案: 給子元素設置寬度,比如width:100%; flex佈局和文字溢出省略遭遇的問題 https://segmentfault.com/a/1190000045

refanbanzhang 頭像

@refanbanzhang

昵稱 熱飯班長

@munergs

node作為後端的時候遇到的前端session無法保存的問題和解決辦法

2023-07-18 更新 前後端分離項目建議還是使用token,也就是後端使用jsonwebtoken即jwt進行token的生成和驗證,token不存在本地,存在客户端,隨請求頭一起帶來,安全性還是有保障 同時跨域問題建議還是後端進行解決,最好不要前端進行反向代理,容易出問題,由於我使用nodejs作為後端,解決跨域問題代碼如下: //安裝cors庫 npm i cors //app.js

munergs 頭像

@munergs

昵稱 munergs

@shaogongbra

duxapp:基於Taro使用模塊化開發,提升開發效率

duxapp是基於Taro二次開發的模塊化框架 使用這個框架,結合框架提供的UI庫和工具庫,能幫助你快速且高質量的完成項目,且能實現同時開發小程序、H5、APP(React Native),並且保證各個端的一致性 duxapp還針對APP開發(React Native)做了大量優化,大大降低了APP發開的難度,你可以閲讀React Native教程,瞭解詳情 下面讓我來詳細介紹如何使用duxapp

shaogongbra 頭像

@shaogongbra

昵稱 ShaoGongBra

@icecreamlj

從0到1:React項目中的Webpack配置實戰

公司項目一般都是使用集團封裝好的腳手架,腳手架內部實現咱看不到也摸不着,好不容易組內推行新的UI框架,需要自行定義 webpack 配置,這可是個絕佳的好機會,我對配置過程進行了梳理,把商業項目的成熟配置小跑着送上。 初始化 首先新建一個空文件夾,執行 npm init 初始化生成 package.json 文件。 創建 src 文件夾,項目的業務代碼都放在這裏,再創建 index.js,這是項目

icecreamlj 頭像

@icecreamlj

昵稱 一顆冰淇淋

@jiangchuan_5ecf6be720834

7 款最棒的 React 移動端 UI 組件庫 - 特別針對國內使用場景推薦

本文完整版:《7 款最棒的 React 移動端 UI 組件庫 - 特別針對國內使用場景推薦》 優秀的 React UI 移動端組件庫和模版框架,幫我們節省開發時間,提高開發效率,統一設計語言。更棒的是內置的功能複雜,我們自己很難處理的常用組件,比如表格、表單、富文本編輯器、時間日期選擇器、實時拖拽組件等,再進一步,還有幫我們把組件的輪子裝好的 React admin 後台管理系統。本文推薦 7 款

@feixi50

開始開發 MCP Server

部署 MCP Server 到函數計算 FC 完成 Server 的開發後,你可以通過 Serverless Devs CLI 工具一鍵將你的 MCP Server 部署到函數計算。Serverless Devs 是通過 s.yaml 部署代碼的,其需要包含所有部署需要的信息,包括實例規格、代碼目錄、觸發器配置等等,而 CLI 已經幫你寫好了,因此你不需要在意這些。 在部署之前,還需要對代碼

feixi50 頭像

@feixi50

昵稱 feixi50

@cricis

12 分鐘介紹所有主流 (Web) 框架

本內容是對 Every Web Framework Explained in 12 Minutes 內容的翻譯與整理。 Ruby on Rails Ruby on Rails 是一個基於 Ruby 編程語言開發的服務器端 Web 框架。它誕生於 2004 年,主要用於構建網站。你可以通過它創建和管理數據庫、構建網頁,並在後端進行整體管理。這種架構被稱為 MVC(模型-視圖-控制器)。它還使

cricis 頭像

@cricis

昵稱 好文收藏

@wszgrcy

通用表單解決方案---皮影

皮影為不同框架提供統一的表單開發體驗 使開發者更加關注於邏輯和佈局,從瑣碎事物中解放出來 皮影的相關設置更加語義化,減少開發心智;並允許自定義封裝 皮影完全兼容valibot的所有Action,可以完美的利用其驗證及轉換機制 文檔 感性的認識可能會讓您更快的體驗到皮影的魅力,網站上實現了大量的用例,方便您快速瞭解皮影 https://piying-org.github.io/we

wszgrcy 頭像

@wszgrcy

昵稱 wszgrcy