PR-149165: adding testing pipelines and npx cli command.

.github/workflows/npm-publish.yml

@@ -0,0 +1,54 @@
+name: NPM testing and publish package
+
+on:
+  push:
+    branches: [ master ]
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm test
+  cypress-run:
+    runs-on: ubuntu-latest
+    env:
+      PORT: 3000
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      # Install NPM dependencies, cache them correctly
+      # and run all Cypress tests
+      - name: Cypress run
+        uses: cypress-io/github-action@v5 # use the explicit version number
+        with:
+          build: npm run build:frontend
+          start: npm start
+  cypress-run-component:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      # Install NPM dependencies, cache them correctly
+      # and run all Cypress tests
+      - name: Cypress run
+        uses: cypress-io/github-action@v5 # use the explicit version number
+        with:
+          component: true
+  publish-npm:
+    needs: [ build, cypress-run, cypress-run-component ]
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm publish --access=public
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.npm_token}}

.github/workflows/npm-test.yml

@@ -0,0 +1,58 @@
+name: Testing package
+
+on:
+  pull_request:
+    branches: ['*']
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [16.x]
+        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js 16
+      uses: actions/setup-node@v3
+      with:
+        node-version: 16
+        cache: 'npm'
+        registry-url: https://registry.npmjs.org/
+    - run: npm ci
+    - run: npm test
+  cypress-run:
+    runs-on: ubuntu-latest
+    env:
+      PORT: 3000
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      # Install NPM dependencies, cache them correctly
+      # and run all Cypress tests
+      - name: Cypress run
+        uses: cypress-io/github-action@v5 # use the explicit version number
+        with:
+          build: npm run build:frontend
+          start: npm start
+  cypress-run-component:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      # Install NPM dependencies, cache them correctly
+      # and run all Cypress tests
+      - name: Cypress run
+        uses: cypress-io/github-action@v5 # use the explicit version number
+        with:
+          component: true
+  test-build-package:
+    needs: [ test, cypress-run, cypress-run-component ]
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm run build:frontend

README.md

@@ -29,34 +29,29 @@ This is an exaple of config.
 ENV= #Default production
 #App Port
 PORT= #Default 80
-#PUBLIC URL
-PUBLIC_URL= #Default 'auto'
-#Prefix URL
-PREFIX_URL= #Default ''
-#ONLY EXACT PATH
-ONLY_EXACT_PATH= #Default false
 ```
-The default environment is production, the app port defauld is 80 and the default public url is "auto", use prefix url if you want a prefix on base url, use exact path to validate if you want to have strict exact paths.
+The default environment is production and the app port defauld is 80.
 
 ### For Development
 In the terminal run:
 ```
-npm run start:dev
+npm run start-frontend:dev
+npm run start-server:dev
 ```
 The ENV enviroment variable should be "development" and choose the port of your preference with the enviroment variable PORT.
 
 You will find the root component on:
 ```
-scr/frontend/components/App.tsx
+src/frontend/components/App.tsx
 ```
 You will find the Initial Component on:
 ```
-scr/frontend/components/InitialComponent.tsx
+src/frontend/components/InitialComponent.tsx
 ```
 
 The manage of the routes you should find on:
 ```
-scr/routes
+src/routes
 ```
 It is using "useRoutes" hook for working, more information for this here: (https://reactrouter.com/docs/en/v6/api#useroutes)
 

bin/cli.js

@@ -0,0 +1,110 @@
+#!/usr/bin/env node
+const { execSync } = require('child_process');
+var fs = require('fs');
+
+const isWin = process.platform === 'win32';
+ 
+const runCommand = command => {
+	try{
+		execSync(`${command}`, {stdio: 'inherit'});
+	} catch (e) {
+		console.error(`Failed to execute ${command}`, e);
+		return false;
+	}
+	return true;
+};
+
+const runCommandWithOutput = command => {
+	try{
+		return execSync(`${command}`);
+	} catch (e) {
+		console.error(`Failed to execute ${command}`, e);
+		return false;
+	}
+};
+
+const replaceTextOnFile = ({
+	file,
+	textToBeReplaced,
+	textReplace,
+	arrOfObjectsBeReplaced
+}) => {
+	let data; 
+	try{
+		data = fs.readFileSync(file, 'utf8');
+	} catch (e) {
+		console.error(`Failed to read file ${file}`, e);
+		return false;
+	}
+
+	let result;
+	if(arrOfObjectsBeReplaced){
+		arrOfObjectsBeReplaced.forEach( obj => {
+			if(result){
+				result = result.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' ');
+			}else{
+				result = data.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' ');
+			}
+		});
+	}else{
+		result = data.replace(textToBeReplaced, textReplace).replace(/^\s*[\r\n]/gm, ' ');
+	}
+
+	try{
+		console.log('text changed');
+		fs.writeFileSync(file, result, 'utf8');
+	} catch (e) {
+		console.error(`Failed to read file ${file}`, e);
+		return false;
+	}
+};
+    
+const repoName = process.argv[2];
+const gitCheckoutCommand = `git clone --depth 1 https://github.com/aleleba/create-react-go-ssr ${repoName}`;
+console.log(`Cloning the repository with name ${repoName}`);
+const checkedOut = runCommand(gitCheckoutCommand);
+if(!checkedOut) process.exit(-1);
+
+const actualVersion = runCommandWithOutput(`cd ${repoName} && node -p "require('./package.json').version"`).toString().trim();
+
+const installDepsCommand = `cd ${repoName} && npm install`;
+const cleanGitHistoryCommand = `cd ${repoName} && rm -rf .git && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`;
+const cleanGitHistoryCommandWindows = `cd ${repoName} && rmdir .git /s /q && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`;
+const deleteFoldersCommand = `cd ${repoName} && rm -rf .github && rm -rf bin`;
+const deleteFoldersCommandWindows = `cd ${repoName} && rmdir .github /s /q && rmdir bin /s /q`;
+
+console.log(`Installing dependencies for ${repoName}`);
+const installedDeps = runCommand(installDepsCommand);
+if(!installedDeps) process.exit(-1);
+
+console.log(`Replacing Json data for ${repoName}`);
+replaceTextOnFile({ 
+	file: `./${repoName}/package.json`,
+	arrOfObjectsBeReplaced: [
+		{
+			textToBeReplaced: '"bin": "./bin/cli.js",', 
+			textReplace: ''
+		},
+		{
+			textToBeReplaced: `"version": "${actualVersion}",`, 
+			textReplace: '"version": "0.0.1",'
+		},
+		{
+			textToBeReplaced: '"name": "@aleleba/create-react-go-ssr",', 
+			textReplace: `"name": "${repoName}",`
+		}
+	]
+});
+
+console.log(`Cleaning History of Git for ${repoName}`);
+const cleanGitHistory = isWin ? runCommand(cleanGitHistoryCommandWindows) : runCommand(cleanGitHistoryCommand);
+if(!cleanGitHistory) process.exit(-1);
+
+console.log('Congratulations! You are ready. Follow the following commands to start');
+console.log(`cd ${repoName}`);
+console.log('Create a .env file with ENV=development(defauld: production), PORT=3000 (default: 80)');
+console.log('Then you can run: npm start-frontend:dev');
+console.log('Then you can run: npm start-server:dev');
+
+const deleteFolders = isWin ? runCommand(deleteFoldersCommandWindows) : runCommand(deleteFoldersCommand);
+if(!deleteFolders) process.exit(-1);

package.json

@@ -1,14 +1,14 @@
 {
   "name": "@aleleba/create-react-go-ssr",
-  "version": "0.1.1",
-  "description": "Starter Kit of server side render of react",
+  "version": "1.0.0",
+  "description": "Starter Kit of server side render of react with backend in go",
   "bin": "./bin/cli.js",
-  "main": "src/server/index",
   "scripts": {
     "start": "cd build/server && ./react-server",
     "start-frontend:dev": "webpack watch --config webpack.config.ts",
     "start-server:dev": "cd src/server && go run main.go",
     "build": "webpack --config webpack.config.ts && cd src/server && go build && mkdir ../../build && cp -r ./ ../../build/server && cp -r ../routes ../../build/routes && rm -rf ./react-server",
+    "build:frontend": "webpack --config webpack.config.ts",
     "lint": "eslint ./ --ext .js --ext .ts --ext .jsx --ext .tsx",
     "lint:fix": "eslint ./ --ext .js --ext .ts --ext .jsx --ext .tsx --fix",
     "test": "jest",
@@ -34,9 +34,9 @@
   "author": "Alejandro Lembke Barrientos",
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/aleleba/create-react-ssr/issues"
+    "url": "https://github.com/aleleba/create-react-go-ssr/issues"
   },
-  "homepage": "https://github.com/aleleba/create-react-ssr#readme",
+  "homepage": "https://github.com/aleleba/create-react-go-ssr#readme",
   "dependencies": {
     "@babel/register": "^7.22.15",
     "dotenv": "^16.3.1",