通過示例講解Remix?設(shè)計哲學(xué)理念
Remix 中的豐富經(jīng)驗
Remix 版本： v1.14.1
Remix philosophy 閱讀過程中感受最深的一個詞 經(jīng)驗豐富，使用一個 map 數(shù)據(jù)結(jié)構(gòu)來表示:
let remixPhilosophy = Map({
1: '開發(fā)經(jīng)驗豐富',
2: '培訓(xùn)經(jīng)驗豐富',
3：'開源經(jīng)驗豐富'
})
遵循 web 客觀發(fā)展
客觀發(fā)展點用一個 map 數(shù)據(jù)結(jié)構(gòu)表示：
let rich_experience = Map({
1: '遵循 S/C 模型',
2: '遵循 Web 標(biāo)準(zhǔn)'，
3: '遵循漸進式增強',
4: '不過渡抽象',
})
遵循 S/C 模型
Remix 將前端統(tǒng)一到一個 Route Module 里面，但是依然遵循 S/C 模型：
- loader 前端端數(shù)據(jù)描述：
let sc_remix_router = {
fe: 'useLoaderData_hook',
be: 'export_loader_async_fn'
}
- action 前后端數(shù)據(jù)描述：
let sc_remix_router = {
fe: 'useActionData_hook',
be: 'export_action_async_fn'
}
遵循 Web 標(biāo)準(zhǔn)
遵循 web 標(biāo)準(zhǔn)發(fā)展描述：
let web = {
'support': ['web_standard', 'http', 'html'],
'examples': ['fetch_api', 'link_tag', 'meta_tag', 'form']
}
漸進式
在原有的 html 基礎(chǔ)上，做 css/javascript/from/異步數(shù)據(jù)等功能增強
let enhance = {
can_no_css_or_javascript: true,
can_on_layout_data: true,
can_no_loading: true,
data_CRUD: true
}
不做過度抽象
remix 由于有教育經(jīng)驗，對過度的抽象是敏感的，很明顯是過度抽象不利于初學(xué)者。例如引入 css 依然使用 link 來引入，不同的是：從 link 標(biāo)簽，變成輸出一個 link 函數(shù)。
let define_link_example = {
html: 'link_tag',
remix: 'export_link_fn'
}
小結(jié)
remix 由于多年的開發(fā)和培訓(xùn)以及開源經(jīng)驗，開發(fā)一套遵循 Web 標(biāo)準(zhǔn)和 S/C 模型的漸進式的全?？蚣?。Remix 的路由模塊結(jié)構(gòu)簡單清晰，能方便快捷的完成 web 開發(fā)任務(wù)。
以上就是通過示例講解Remix 設(shè)計哲學(xué)理念的詳細內(nèi)容，更多關(guān)于Remix 設(shè)計哲學(xué)理念的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要為大家詳細介紹了React中獲取真實的dom的相關(guān)方法,文中的示例代碼講解詳細,具有一定的借鑒價值,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2025-02-02
React Router提供了幾種不同的跳轉(zhuǎn)方式,包括使用組件進行頁面跳轉(zhuǎn)、使用組件進行重定向,以及使用編程式導(dǎo)航進行跳轉(zhuǎn),這篇文章主要介紹了React中的頁面跳轉(zhuǎn)方式詳解,需要的朋友可以參考下2023-09-09
這篇文章主要為大家詳細介紹了react實現(xiàn)動態(tài)選擇框，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-08-08
這篇文章主要為大家介紹了React中如何處理承諾demo，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-12-12
在?React?中使用?Context?API?實現(xiàn)跨組件通信的方法
在React中,ContextAPI是一個很有用的特性,可用于組件間的狀態(tài)共享,它允許跨組件傳遞數(shù)據(jù)而無需通過每個組件手動傳遞props,本文給大家介紹在?React?中如何使用?Context?API?來實現(xiàn)跨組件的通信,感興趣的朋友一起看看吧2024-09-09
Reactjs?+?Nodejs?+?Mongodb?實現(xiàn)文件上傳功能實例詳解
今天是使用?Reactjs?+?Nodejs?+?Mongodb?實現(xiàn)文件上傳功能，前端我們使用?Reactjs?+?Axios?來搭建前端上傳文件應(yīng)用，后端我們使用?Node.js?+?Express?+?Multer?+?Mongodb?來搭建后端上傳文件處理應(yīng)用，本文通過實例代碼給大家介紹的非常詳細，需要的朋友參考下吧2022-06-06
深入了解響應(yīng)式React Native Echarts組件
近年來，隨著移動端對數(shù)據(jù)可視化的要求越來越高，通過 WebView 在移動端使用 Echarts 這樣功能強大的前端數(shù)據(jù)可視化庫，是解決問題的好辦法。下面就和小編來一起學(xué)習(xí)一下吧2019-05-05
react-router browserHistory刷新頁面404問題解決方法
本篇文章主要介紹了react-router browserHistory刷新頁面404問題解決方法，非常具有實用價值，需要的朋友可以參考下2017-12-12
關(guān)于React動態(tài)加載路由處理的相關(guān)問題
這篇文章主要介紹了關(guān)于React動態(tài)加載路由處理的相關(guān)問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-01-01
筆者最近用react useEffect閉包，其中踩到了一些坑在此與大家分享一下。需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-06-06