Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit2d5c6a0

Browse files
committed
First batch of demo steps
1 parente7eb16c commit2d5c6a0

File tree

8 files changed

+168
-0
lines changed

8 files changed

+168
-0
lines changed
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
[{
2+
"title":"Install new dependencies",
3+
"sourceFile":"package.json",
4+
"replaceTextOrFile":"demosteps\\package.json",
5+
"selectionRange": [13,15]
6+
},
7+
{
8+
"title":"Create Weather module",
9+
"sourceFile":"src\\widgets\\weather\\redux\\weather-module.js",
10+
},
11+
{
12+
"title":"Define Weather module",
13+
"sourceFile":"src\\widgets\\weather\\redux\\weather-module.js",
14+
"replaceTextOrFile":"demosteps\\weather-module.js"
15+
},
16+
{
17+
"title":"Open Index.js to Connect Weather Component to module",
18+
"sourceFile":"src\\widgets\\weather\\index.js"
19+
},
20+
{
21+
"title":"Add imports Weather Component to module",
22+
"sourceFile":"src\\widgets\\weather\\index.js",
23+
"replaceTextOrFile":"demosteps\\weather-index-imports.js",
24+
"selectionRange": [2,4]
25+
},
26+
{
27+
"title":"Connect Weather Component to module",
28+
"sourceFile":"src\\widgets\\weather\\index.js",
29+
"replaceTextOrFile":"demosteps\\weather-index.js",
30+
"selectionRange": [6,12]
31+
},
32+
{
33+
"title":"Define Hacker News module",
34+
"sourceFile":"src\\widgets\\hacker-news\\redux\\hacker-news-module.js",
35+
"replaceTextOrFile":"demosteps\\hacker-news-module.js"
36+
},
37+
{
38+
"title":"Open index.js to connect News component to module",
39+
"sourceFile":"src\\widgets\\hacker-news\\index.js"
40+
},
41+
{
42+
"title":"Add imports to connect News component to module",
43+
"sourceFile":"src\\widgets\\hacker-news\\index.js",
44+
"replaceTextOrFile":"demosteps\\hacker-news-index-imports.js",
45+
"selectionRange": [2,4]
46+
},
47+
{
48+
"title":"Connect Hacker News component to module",
49+
"sourceFile":"src\\widgets\\hacker-news\\index.js",
50+
"replaceTextOrFile":"demosteps\\hacker-news-index.js",
51+
"selectionRange": [6,19]
52+
},
53+
{
54+
"title":"Open App.js",
55+
"sourceFile":"src\\App.js"
56+
}
57+
]
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import{ConnectedHackerNews}from"./component/hacker-news-component";
2+
import{getHackerNewsModule}from"./redux/hacker-news-module";
3+
import{DynamicModuleLoader}from"redux-dynamic-modules";
4+
import*asReactfrom"react";
5+
6+
exportdefaultConnectedHackerNews;
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import{ConnectedHackerNews}from"./component/hacker-news-component";
2+
import{getHackerNewsModule}from"./redux/hacker-news-module";
3+
import{DynamicModuleLoader}from"redux-dynamic-modules";
4+
import*asReactfrom"react";
5+
6+
exportdefaultfunctionDynamicHackerNews(){
7+
return(
8+
// define the module dependency for the HackerNews component
9+
// DynamicModuleLoader is a HOC provided by redux-dynamic-modules
10+
// It loads the module on ComponentDidMount and unloads on ComponentDidUnmount
11+
<DynamicModuleLoadermodules={[getHackerNewsModule()]}>
12+
{/*
13+
This is the Hacker News component that is connected to the redux store,
14+
the connected component need not know anything about modules.
15+
*/}
16+
<ConnectedHackerNews/>
17+
</DynamicModuleLoader>
18+
);
19+
}
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import{hackerNewsReducer}from"./hacker-news-reducer";
2+
import{fetchStories}from"./hacker-news-actions";
3+
4+
exportfunctiongetHackerNewsModule(){
5+
return{
6+
// Unique id of the module
7+
id:"hacker-news",
8+
// Maps the Store key to the reducer
9+
reducerMap:{
10+
hackerNews:hackerNewsReducer
11+
},
12+
// Optional: Any actions to dispatch when the module is loaded
13+
initialActions:[fetchStories()],
14+
// Optional: Any actions to dispatch when the module is unloaded
15+
finalActions:[]
16+
};
17+
}
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name":"widgets-example",
3+
"version":"0.0.16",
4+
"private":true,
5+
"dependencies": {
6+
"immer":"^1.7.2",
7+
"react":"^16.5.2",
8+
"react-dom":"^16.5.2",
9+
"react-loadable":"^5.5.0",
10+
"react-redux":"^5.0.7",
11+
"react-scripts":"2.0.4",
12+
"redux":"^3.5.2",
13+
"redux-dynamic-modules":"^0.0.16",
14+
"redux-dynamic-modules-saga":"^0.0.16",
15+
"redux-dynamic-modules-thunk":"^0.0.16",
16+
"redux-saga":"^0.16.2",
17+
"redux-thunk":"^2.3.0"
18+
},
19+
"scripts": {
20+
"start":"react-scripts start",
21+
"build":"react-scripts build",
22+
"eject":"react-scripts eject"
23+
},
24+
"eslintConfig": {
25+
"extends":"react-app"
26+
},
27+
"browserslist": [
28+
">0.2%",
29+
"not dead",
30+
"not ie <= 11",
31+
"not op_mini all"
32+
]
33+
}
34+
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import{ConnectedWeather}from"./component/weather-component";
2+
import{getWeatherModule}from"./redux/weather-module";
3+
import{DynamicModuleLoader}from"redux-dynamic-modules";
4+
import*asReactfrom"react";
5+
6+
exportdefaultConnectedWeather;
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import{ConnectedWeather}from"./component/weather-component";
2+
import{getWeatherModule}from"./redux/weather-module";
3+
import{DynamicModuleLoader}from"redux-dynamic-modules";
4+
import*asReactfrom"react";
5+
6+
exportdefaultfunctionDynamic(){
7+
return(
8+
<DynamicModuleLoadermodules={[getWeatherModule()]}>
9+
<ConnectedWeather/>
10+
</DynamicModuleLoader>
11+
);
12+
}
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import{weatherReducer}from"./weather-reducer";
2+
import{weatherSaga}from"./weather-saga";
3+
4+
exportfunctiongetWeatherModule(){
5+
return{
6+
// Unique id of the module
7+
id:"weather",
8+
// Maps the Store key to the reducer
9+
reducerMap:{
10+
weatherState:weatherReducer
11+
},
12+
// This module uses redux-saga middleware
13+
// This property will be be used by the SagaExtension
14+
// to run sagas for the moduleD
15+
sagas:[weatherSaga]
16+
};
17+
}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp