Skip to content

Commit 44e58c2

Browse files
shaantanu9shaantanu9
committed
Added the 4 CLI Packages that help ease the MERN Stack Journey of any new Developer
1 parent 4f6199d commit 44e58c2

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

74 files changed

+6342
-0
lines changed

‎CLI-Tools-MERN-Stack-beginners/.gitignore

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
node_modules
2+
.DS_Store
3+
.dart_tool/
4+
.packages
5+
build/
6+
pubspec.lock
7+
8+
doc/api/
9+
10+
.env*
11+
12+
*.dart.js
13+
*.info.json # Produced by the --dump-info flag.
14+
*.js # When generated by dart2js. Don't specify *.js if your
15+
# project includes source files written in JavaScript.
16+
*.js_
17+
*.js.deps
18+
*.js.map
19+
20+
.flutter-plugins
21+
.flutter-plugins-dependencies
22+
23+
.pnp.*
24+
.yarn/*
25+
!.yarn/patches
26+
!.yarn/plugins
27+
!.yarn/releases
28+
!.yarn/sdks
29+
!.yarn/versions
30+
31+
.yarn/*
32+
!.yarn/cache
33+
!.yarn/patches
34+
!.yarn/plugins
35+
!.yarn/releases
36+
!.yarn/sdks
37+
!.yarn/versions
38+
39+
*.class
40+
41+
*.log
42+
43+
*.ctxt
44+
45+
.mtj.tmp/
46+
47+
*.jar
48+
*.war
49+
*.nar
50+
*.ear
51+
*.zip
52+
*.tar.gz
53+
*.rar
54+
55+
hs_err_pid*
56+
replay_pid*
57+
58+
/coverage
59+
/build
60+
npm-debug.log*

‎CLI-Tools-MERN-Stack-beginners/configure-react/.gitignore

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
node_modules
2+
DS_Store
3+
npm-debug.log
4+
yarn-error.log
5+
yarn-debug.log
6+
.env
7+
.env.local
8+
.env.development.local
9+
.env.test
10+
.env.production.local

‎CLI-Tools-MERN-Stack-beginners/configure-react/commands/basic-react-app.command.js

+90
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
const shell = require("shelljs");
2+
const path = require("path");
3+
const details = require("configure-react/commands/details.json");
4+
const fs = require("fs");
5+
// console.log(details.reactApp.appJsData.join("\n"))
6+
7+
const installreactRouter = () => {
8+
shell.exec(`npm i react-router-dom`);
9+
shell.exec(`npm i react-dom`);
10+
};
11+
12+
const editRouterJs = () => {
13+
routerFileCode = details.reactApp.routerFileCode.join("\n");
14+
fs.writeFileSync(
15+
path.join(shell.pwd() + "/src/router/RoutesLink.js"),
16+
routerFileCode,
17+
(err, data) => {}
18+
);
19+
};
20+
21+
const createRouterFolder = () => {
22+
shell.exec("mkdir " + path.join(shell.pwd() + "/src/router"));
23+
shell.exec("mkdir " + path.join(shell.pwd() + "/src/components"));
24+
25+
shell.exec("touch " + path.join(shell.pwd() + "/src/router/index.js"));
26+
shell.exec("touch " + path.join(shell.pwd() + "/src/router/RoutesLink.js"));
27+
editRouterJs();
28+
};
29+
30+
const editAppJs = () => {
31+
appJsData = details.reactApp.appJsFileCode.join("\n");
32+
33+
shell.exec("rm -rf " + path.join(shell.pwd() + "/src/App.css"));
34+
fs.writeFileSync(
35+
path.join(shell.pwd() + "/src/App.js"),
36+
appJsData,
37+
(err, data) => {}
38+
);
39+
installreactRouter();
40+
createRouterFolder();
41+
shell.exec("npm run start");
42+
};
43+
44+
const runBuild = () => {
45+
editAppJs();
46+
};
47+
48+
const editTaiwindConfig = () => {
49+
tailwindReactConfigData = details.tailwindReactConfigData.join("\n");
50+
51+
srcIndexCSSData = details.srcIndexCSSData.join("\n");
52+
53+
fs.writeFileSync(
54+
path.join(shell.pwd() + "/tailwind.config.js"),
55+
tailwindReactConfigData,
56+
(err, data) => {}
57+
);
58+
fs.writeFileSync(
59+
path.join(shell.pwd() + "/src/index.css"),
60+
srcIndexCSSData,
61+
(err, data) => {}
62+
);
63+
64+
runBuild();
65+
};
66+
67+
const configureForTailwind = () => {
68+
shell.exec("npm install -D tailwindcss postcss autoprefixer");
69+
shell.touch("tailwind.config.js");
70+
71+
editTaiwindConfig();
72+
};
73+
74+
const createTailwindReactApp = (name) => {
75+
const projectExist = require("configure-react/commands/projectExist");
76+
if (projectExist(name) == true) {
77+
shell.exit();
78+
}
79+
80+
try {
81+
shell.exec(`npx create-react-app ${name}`);
82+
shell.cd(name);
83+
configureForTailwind();
84+
} catch (err) {
85+
console.log(err.message);
86+
shell.exit();
87+
}
88+
};
89+
90+
module.exports = createTailwindReactApp;

‎CLI-Tools-MERN-Stack-beginners/configure-react/commands/basic-react-app/basic-react-app.command.js

+63
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
const shell = require("shelljs");
2+
const path = require("path");
3+
const fs = require("fs");
4+
const wrapTagAround = require("configure-react/utils/wrapTagAround");
5+
const importAtTop = require("configure-react/utils/importAtTop");
6+
7+
const settingReactRouter = () => {
8+
// Create Routes
9+
shell.exec("npx configure-react create-routes");
10+
};
11+
12+
const settingRedux = () => {
13+
// Create Redux
14+
shell.exec("npx configure-react create-redux");
15+
};
16+
17+
const settingFormik = () => {
18+
// Create Formik
19+
};
20+
21+
const settingAxios = () => {
22+
// Create Axios
23+
24+
25+
26+
27+
};
28+
29+
const startCreateReactApp = () => {
30+
shell.exec(
31+
"npm i react-router-dom react-router redux react-redux redux-thunk formik yup axios react-toastify react-icons "
32+
);
33+
settingReactRouter();
34+
settingRedux();
35+
settingFormik();
36+
settingYup();
37+
settingAxios();
38+
settingReactToastify();
39+
settingReactIcons();
40+
};
41+
42+
const basicReactApp = (projectName) => {
43+
if (projectName[0] !== ".")
44+
return console.log(
45+
"Please go to the project directory root where package.json and react install and run the command"
46+
);
47+
const currentPath = process.cwd();
48+
const packageJsonPath = path.join(currentPath, "./package.json");
49+
const packageJsonData = fs.readFileSync(packageJsonPath, "utf8");
50+
const packageJsonDataObject = JSON.parse(packageJsonData);
51+
const packageJsonDataObjectScripts = packageJsonDataObject.scripts;
52+
if (
53+
packageJsonDataObjectScripts["start"] !== "react-scripts start" ||
54+
packageJsonData.dependencies.react === undefined
55+
) {
56+
return console.log(
57+
"Please install react and run the command from the project directory root where package.json and react install"
58+
);
59+
}
60+
startCreateReactApp();
61+
};
62+
63+
module.exports = basicReactApp;

‎CLI-Tools-MERN-Stack-beginners/configure-react/commands/basic-react-app/create-routes.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
const path = require("path");
2+
const fs = require("fs");
3+
const shell = require("shelljs");
4+
const sameFileExist = require("configure-react/utils/sameFileExist");
5+
const makeCodePritter = require("configure-react/utils/makeCodePritter");
6+
const wrapTagAround = require("configure-react/utils/wrapTagAround");
7+

‎CLI-Tools-MERN-Stack-beginners/configure-react/commands/chakraUi.command.js

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
const { wrapTagAround, ifNotDot } = require("configure-react/utils");
2+
3+
const shell = require("shelljs");
4+
const path = require("path");
5+
const fs = require("fs");
6+
7+
const editIndexJs = (currentPath) => {
8+
const indexJsPath = path.join(currentPath, "./src/index.js");
9+
wrapTagAround(
10+
"ChakraProvider",
11+
indexJsPath,
12+
"ChakraProvider",
13+
"@chakra-ui/react"
14+
);
15+
};
16+
17+
const editPackageJson = () => {
18+
console.log("editPackageJson function called");
19+
const currentPath = process.cwd();
20+
// const packageJsonPath = path.join(currentPath, "./package.json");
21+
// const packageJson = require("./package.json");
22+
console.log(currentPath);
23+
editIndexJs(currentPath);
24+
// editIndexJs();
25+
};
26+
const chakraUi = async ([projectName]) => {
27+
function run() {
28+
ifNotDot(projectName);
29+
editPackageJson();
30+
}
31+
run();
32+
33+
// ifNotDot(projectName);
34+
// editPackageJson();
35+
};
36+
37+
module.exports = chakraUi;
38+
39+
// Language: javascript
40+
41+
// ======================= Add Provider in index.js ======================= // add provider in index.js file
42+
// Add the provider in index.js file keeping the other code as it is

‎CLI-Tools-MERN-Stack-beginners/configure-react/commands/createAxios.command.js

+106
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
const shell = require("shelljs");
2+
const path = require("path");
3+
const fs = require("fs");
4+
const wrapTagAround = require("configure-react/utils/wrapTagAround");
5+
const importAtTop = require("configure-react/utils/importAtTop");
6+
7+
const detail = require("configure-react/commands/details.json");
8+
9+
const {
10+
editReadme,
11+
createDotEnv,
12+
createComponent,
13+
checkIfRoot,
14+
makeCodePritter,
15+
endingScreen,
16+
} = require("configure-react/utils");
17+
18+
const createAxios = (args) => {
19+
if (!checkIfRoot(args)) {
20+
return console.log(
21+
"You are not in the root of a react app. Please run this command in the root of a react app."
22+
);
23+
}
24+
const currentPath = process.cwd();
25+
startCreatingAxios(currentPath);
26+
endingScreen();
27+
};
28+
29+
const startCreatingAxios = (currentPath) => {
30+
shell.exec("npm i axios");
31+
32+
const readmePath = path.join(currentPath, "./README.md");
33+
editReadme(readmePath, "axios");
34+
shell.mkdir("-p", path.join(currentPath, "./src/api")); // -p flag creates parent directories if they don't exist
35+
// create file if not exist
36+
const env = path.join(currentPath, "./.env");
37+
const componentPath = path.join(currentPath, "./src/components");
38+
// if (!fs.existsSync(env)) {
39+
createDotEnv(env);
40+
createComponent(componentPath);
41+
// }
42+
43+
shell.touch(path.join(currentPath, "./src/api/index.js"));
44+
shell.touch(path.join(currentPath, "./src/api/login.js"));
45+
shell.touch(path.join(currentPath, "./src/api/register.js"));
46+
shell.touch(path.join(currentPath, "./src/api/getData.js"));
47+
shell.touch(path.join(currentPath, "./src/api/postData.js"));
48+
49+
const indexFilePath = path.join(currentPath, "./src/api/index.js");
50+
const loginFilePath = path.join(currentPath, "./src/api/login.js");
51+
const registerFilePath = path.join(currentPath, "./src/api/register.js");
52+
const getDataFilePath = path.join(currentPath, "./src/api/getData.js");
53+
const postDataFilePath = path.join(currentPath, "./src/api/postData.js");
54+
55+
// edit index.js
56+
const apiIndex = detail.apiIndexData.join("\n");
57+
fs.writeFileSync(indexFilePath, makeCodePritter(apiIndex), "utf8", (err) => {
58+
if (err) throw err;
59+
});
60+
61+
// edit login.js
62+
const loginApiData = detail.loginApiData.join("\n");
63+
fs.writeFileSync(
64+
loginFilePath,
65+
makeCodePritter(loginApiData),
66+
"utf8",
67+
(err) => {
68+
if (err) throw err;
69+
}
70+
);
71+
72+
// edit register.js
73+
const registerApiData = detail.registerApiData.join("\n");
74+
fs.writeFileSync(
75+
registerFilePath,
76+
makeCodePritter(registerApiData),
77+
"utf8",
78+
(err) => {
79+
if (err) throw err;
80+
}
81+
);
82+
83+
// edit getData.js
84+
const getApiData = detail.getApiData.join("\n");
85+
fs.writeFileSync(
86+
getDataFilePath,
87+
makeCodePritter(getApiData),
88+
"utf8",
89+
(err) => {
90+
if (err) throw err;
91+
}
92+
);
93+
94+
// edit postData.js
95+
const postApiData = detail.postApiData.join("\n");
96+
fs.writeFileSync(
97+
postDataFilePath,
98+
makeCodePritter(postApiData),
99+
"utf8",
100+
(err) => {
101+
if (err) throw err;
102+
}
103+
);
104+
};
105+
106+
module.exports = createAxios;

0 commit comments

Comments
 (0)