@前端

動態 列表
@haoshuaidekele

【源碼開放】從1到100萬用户,這套社交系統扛住6次流量洪峯!架構師揭秘:負載均衡+分佈式數據庫+智能熔斷機制是如何做到的?

【源碼開放】:吸引技術愛好者,尤其是對開源項目感興趣的用户。 從1到100萬用户:突出了系統的可擴展性和成功案例,容易引發共鳴。 扛住6次流量洪峯:強調系統的高可用性和抗壓能力,增加了可信度。 架構師揭秘:增加了權威性和專業性,吸引對技術細節感興趣的讀者。 負載均衡+分佈式數據庫+智能熔斷機制:具體的技術關鍵詞,精準吸引目標用户。 數據可視化傳播 用户增長曲線圖 製

haoshuaidekele 頭像

@haoshuaidekele

昵稱 duikeadmin

@kestrel_task

【nodejs進階之旅(2)】:使用koa2+mysql 實現列表數據分頁

1.展示效果(分頁) 2.分頁主要字段 分頁主要字段包括 pageSize 每頁條數、pageNum 第幾頁、startRow 當前開始頁編號、endRow 當前結束頁編號、total 總數量。主要是根據前端分頁的參數,進行處理後,返回前端正確的數據,其實是一個很常見且簡單的功能。但是是非常也是非常重要的。 pageSize 每頁條數 pageNum 第幾頁 startRow 當前開始頁編號

kestrel_task 頭像

@kestrel_task

昵稱 微芒不朽

@johanazhu

Koa2從零到腳手架

什麼是 Koa2 由 Express 原班人馬打造的新生代 Node.js Web 框架,它的代碼很簡單,沒有像 Express 那樣,提供路由、靜態服務等等,它是為了解決 Node 問題(簡化了 Node 中操作)並取代之,它本身是一個簡單的中間件框架,需要配合各個中間件才能使用 文檔 中文文檔 (野生) 最簡單的 Koa 服務器 const Koa = require('koa') cons

johanazhu 頭像

@johanazhu

昵稱 山頭人漢波

@johanazhu

從淺入深瞭解Koa2源碼

在前文我們介紹過什麼是 Koa2 的基礎 簡單回顧下 什麼是 koa2 NodeJS 的 web 開發框架 Koa 可被視為 nodejs 的 HTTP 模塊的抽象 源碼重點 中間件機制 洋葱模型 compose 源碼結構 Koa2 的源碼地址:https://github.com/koajs/koa 其中 lib 為其源碼 可以看出,只有四個文件:application.js、cont

johanazhu 頭像

@johanazhu

昵稱 山頭人漢波

@johanazhu

一步一步來:手寫Koa2

之前講過Koa2從零到腳手架,以及從淺入深瞭解Koa2源碼 這篇文章講解如何手寫一個 Koa2 Step 1:封裝 HTTP 服務和創建 Koa 構造函數 之前閲讀 Koa2 的源碼得知, Koa 的服務應用是基於 Node 原生的 HTTP 模塊,對其進行封裝形成的,我們先用原生 Node 實現 HTTP 服務 const http = require('http') const server

johanazhu 頭像

@johanazhu

昵稱 山頭人漢波

@naiyouweiyongbao

【輕快圖片管理系統】- 開源圖牀系統

輕快圖片管理系統:基於Koa2 + Vue3.x + Vite3.x + typescript開發的輕量級快捷圖片管理系統、圖牀系統 簡介 程序員日常就是寫博客,當然寫博客時就會涉及到在博文中插入圖片,所以往往會使用圖牀來進行圖片資源管理,市面上較流行的圖牀是PicGo,是使用electron-vue開發的桌面應用程序,所以每次需要下載安裝並配置圖牀,比較麻煩。所以開發了這款輕快圖片管理系

naiyouweiyongbao 頭像

@naiyouweiyongbao

昵稱 奶油味擁抱

@kestrel_task

Koa2實現多併發文件上傳

koa2批量上傳文件 目前的是為了實現批量導入md文件,發佈文章。這樣就不用自己一篇一篇同步文章了。一次可以同步幾千篇文章。 實現界面 內容 主要包含上傳的文件標題,文件大小,上傳狀態。 el-upload ref="uploader" v-model:file-list="fileList" drag multiple :accept="accept" :maxSize="maxS

kestrel_task 頭像

@kestrel_task

昵稱 微芒不朽

@kestrel_task

Koa2進階:CMS系統實戰開發秘籍:1.為什麼選擇Koa2?

目錄 為什麼選擇Koa2? Koa2環境搭建 Koa2核心概念/中間件基礎/異步控制流 Koa2路由管理 Koa2請求響應處理 Koa2中間件使用 Koa2錯誤/異常捕獲與處理 Koa2模板引擎集成 Koa2靜態文件服務 Koa2集成數據庫 模型設計/ORM工具使用 接口身份驗證與授權 API接口設計 Koa2日誌記錄 CMS架構設計 CMS內容管理 CMS用户

kestrel_task 頭像

@kestrel_task

昵稱 微芒不朽

@kylebing

寫了個網頁版的五筆跟打器:玫楓跟打器

玫楓跟打器 Roseo Maple Type Pad 線上地址 https://kylebing.cn/tools/typepad/ 截圖 前言 自己是個五筆愛好者,也一直在使用五筆,從 Windows 轉到 Mac 之後,也沒有有可用的跟打器,每回想練練打字了都需要打開 Windows 模擬器來打字。 一直一直想有個能在 macOS 上運行的跟打器。 最初是想自己用 swift

kylebing 頭像

@kylebing

昵稱 KyleBing

@icecreamlj

自定義javascript中call、bind、apply方法

call、bind、apply都是Function原型上的方法,用於改變this的指向 自定義函數 js中的call、bind、apply是用c++代碼實現的,我們這裏使用js代碼做一個模式,沒有把所有的邊界情況考慮進來,僅做一個簡單的實現,三個函數在使用的時候有一些需要注意的地方,在定義的時候需要把這些情況考慮進去 當傳入的值是基本數據類型時,call、apply、bind方法會將它轉變成引

icecreamlj 頭像

@icecreamlj

昵稱 一顆冰淇淋

@iymxpc3k

煩人的this,7個關於js關鍵詞的面試題

更多文章詳見公眾號【前端css和js乾貨】 在 JavaScript 中,this是函數的調用上下文。 難度在於this具有複雜的行為。 本文,整理了一個關於this關鍵字的7個有趣面試問題的列表。 注意:下面的 JavaScript 片段在非嚴格模式下運行,也稱為 sloppy 模式。 1: 變量 vs 屬性 以下代碼會在控制枱打印什麼: const object = { m

iymxpc3k 頭像

@iymxpc3k

昵稱 前端css和js乾貨

@niumingxin

this 指針詳解

概念 this 是當前函數/當前模塊的運行環境上下文。是一個指針型變量,普通函數中的 this 是在調用時才被綁定確認指向的。 通過不同的 this 調用同一個函數,可以產生不同的結果。 到底如何確認 this 綁定的內容是什麼? this 綁定的規則 1.默認綁定 function a() {} a(); 函數獨立調用的時候,不帶任何修飾的函數引用. 非嚴格模式下 this 指向全局對象

niumingxin 頭像

@niumingxin

昵稱 微言

@hero123

理解JavaScript中的this

前言 相信很多人在初學JavaScript的時候都對this的指向問題感覺到比較迷惑。它不像PHP,Java語言中的this有很明確的指向,也不會讓人容易搞混。 在JavaScript中this就是函數調用的上下文,在JavaScript中有四種函數調用: 函數調用,例如alert('hello world') 方法調用,例如console.log('hello world') 構造

hero123 頭像

@hero123

昵稱 hero

@i_62f4ad94a52ca

【Java】this、super關鍵字,代碼塊介紹

文章目錄 一. this引用 1. this引用的介紹 this引用是成員方法的參數之一,不需要用户傳遞實現,由編譯器自動完成,也就是説,這個參數用户是看不到的,但用户可使用這個參數。 this引用指向當前對象(成員方法運行時調用該成員方法的對象),在成員方法中所有成員變量的操作,都是通過該引用去訪問。 只不過所有的操作對用户是透明的,即用户不需要來傳遞,編譯器自動完成。 this 引用的

i_62f4ad94a52ca 頭像

@i_62f4ad94a52ca

昵稱 用户bPc1FjG

@immerse

熱點面試題:聊聊對 this 的理解?

前言 歡迎關注 『前端進階圈』 公眾號 ,一起探索學習前端技術...... 前端小菜雞一枚,分享的文章純屬個人見解,若有不正確或可待討論點可隨意評論,與各位同學一起學習~ 聊聊對 this 對象的理解? 定義 在執行上下文中的一個屬性,它指向最後一次調用這個屬性或方法的對象。通常有四種情況來判斷。 四種情況如下 1. 函數調用模式:當一個函數不是一個對象的屬性時,直接作為函數來調用時

immerse 頭像

@immerse

昵稱 沉浸式趣談

@guisijun

JavaScript中的this指向哪?

大家好,我是歸思君 一、引言 this可以説是前端開發中比較常見的一個關鍵字,由於其指向是在運行時才確定,所以大家在開發中判斷其方向時也會很模糊,今天就把this的指向問題拆開了,揉碎了,好好講一講。 先來看一個場景,看看該處的 this 應該指向哪:首先在 request.js 中定義一個 getAction 函數 export function getAction(url,paramet

guisijun 頭像

@guisijun

昵稱 歸思君

@immerse

熱點面試題:聊聊對 this 的理解?

前言 歡迎關注 『前端進階圈』 公眾號 ,一起探索學習前端技術...... 前端小菜雞一枚,分享的文章純屬個人見解,若有不正確或可待討論點可隨意評論,與各位同學一起學習~ 聊聊對 this 對象的理解? 定義 在執行上下文中的一個屬性,它指向最後一次調用這個屬性或方法的對象。通常有四種情況來判斷。 四種情況如下 1. 函數調用模式:當一個函數不是一個對象的屬性時,直接作為函數來調用時

immerse 頭像

@immerse

昵稱 沉浸式趣談

@yangjunyi_612de77e8a34b

element一些小問題總結

問題:el-dialog加上v-loading會加在整個頁面上? 解決:在el-dialog下套一個el-main或其他,將v-loading加在上面即可。 注意:加上el-main後 ,el-dialog自帶的頁腳區域不顯示,需自己手動寫 問題:修改el-dialog中el-dialog__body的內邊距不生效? 解決:去掉style上的scoped屬性或者deep滲透

yangjunyi_612de77e8a34b 頭像

@yangjunyi_612de77e8a34b

昵稱 小羊不想失棉

@abcdxj555

RSM:超實用的多場景請求管理方案

各位前端er們,用了那麼久的再熟悉不過的接口請求,有沒有覺得不妥???你可能會覺得,這有什麼不妥,不就axios.get一下,fetch一下,請求就發出了嘛,然後再處理返回的數據,完事。真有這麼簡單嗎?問題來了,針對不同場景下的請求需求,真的可以統一這樣處理就完事嗎?我們來聊聊請求這事兒! 聊聊前端請求的場景 我們先來聊聊前端請求的各種場景,以下是一些做請求時遇到的高頻場景。 什麼時候發出請求

abcdxj555 頭像

@abcdxj555

昵稱 愛編程的小金

@abcdxj555

vue+alova入門指南

alova?這是個什麼鬼? 你沒聽説過也是很正常,它是一個RSM實現庫,用於解決在MVVM項目下的不同請求場景下的問題,同時也可以幫你管理服務端狀態。 它就像一個axios的武裝庫,為axios插上了翅膀。 詳細瞭解RSM可參考 RSM:超實用的多場景請求管理方案 這篇文章作為vue+alova的基礎入門篇,你可以瞭解到以下內容: alova如何處理頻繁請求、跨模塊更新服務端狀態、模糊搜索

abcdxj555 頭像

@abcdxj555

昵稱 愛編程的小金

@bradenhan

如何獲取 fetch 返回數據

獲取 fetch 返回數據 Fetch API 提供了一個 JavaScript 接口,用於訪問和操縱 HTTP 管道的一些具體部分,例如請求和響應。 它還提供了一個全局 fetch() 方法,該方法提供了一種簡單,合理的方式來跨網絡異步獲取資源。 這種功能以前是使用 XMLHttpRequest 實現的。 由於以下原因,我們在判斷後端返回數據時候,如果 HTTP 狀態碼錯誤,可能判斷比較麻煩。

bradenhan 頭像

@bradenhan

昵稱 前端老兵

@shishui_63822321355cb

class-fetch:一個用 TypeScript 編寫的優雅的 HTTP 客户端庫

你是否想要用 TypeScript 編寫更安全,更可靠,更簡潔的 HTTP 客户端代碼?如果你的答案是肯定的,那麼你一定會喜歡 class-fetch 這個庫。 class-fetch 是一個用 TypeScript 編寫的 js 庫,用於生成 HTTP 客户端。它基於 fetch,支持瀏覽器和 nodejs 運行時。它使用裝飾器來簡化請求參數和返回值的處理。它使用 class-transform

@qfifteen

受夠了團隊代碼風格不統一?7千字教你從零搭建代碼規範體系

前言 此篇文章主要講解如何來搭建一套代碼規範體系,主要內容為:通過 ESLint + Prettier + Stylelint 實現代碼風格規範、格式化,通過 EditorConfig 實現 IDE 編碼風格規範化 本文約 7k 字,主要內容分為 7 個大章節,內分多個小章節。請耐心讀完,相信你應該有所收穫 本文也是《通俗易懂的中後台系統建設指南》系列的第四篇文章,該系列旨在告訴你如何來構建一個優

qfifteen 頭像

@qfifteen

昵稱 十五