camelaissani/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="https://cdn.jsdelivr.net/npm/frontexpress@1.1.0/frontexpress.min.js"></script>
  <title>Prueba Front Express</title>
</head>
<body>
Probando <br />
  <a class="menu-item" data-id="page1" href="#"> page 1</a>
  <a class="menu-item" data-id="page2" href="#"> page 2</a>
  <a class="menu-item" data-id="page3" href="#"> page 3</a>

  <div class="content"></div>

  <script>

    // Front-end application
    const app = frontexpress();

    // front-end logic on navigation path "Root"
    app.get('/', (req, res) => {
      document.querySelector('.content').innerHTML = `<h1>Index</h1>`;
    });

    // front-end logic on navigation path "/page1"
    app.get('/page1', (req, res) => {
      document.querySelector('.content').innerHTML = `<h1>Page 1 content</h1>`;
    });

    // front-end logic on navigation path "/page2"
    app.get('/page2', (req, res) => {
      document.querySelector('.content').innerHTML = `<h1>Page 2 content</h1>`;
    });

    // front-end logic on navigation path "/page2"
    app.get('/page3', (req, res) => {
      document.querySelector('.content').innerHTML = `<h1>Page 3 content</h1>`;
    });

    // start front-end application
    app.listen(() => {
      // on DOM ready
      const menus = document.querySelectorAll('.menu-item');
      for (let i=0; i<menus.length; i++) {
          const menu = menus[i];
          menu.addEventListener('click', () => {
              app.httpGet(`/${menu.dataset.id}`);
          });
      }

      console.log('App is listening requests');
    });

  </script>

</body>
</html>

## index.js
const
  express = require('express'),
  app = express(),
  path = require('path');

const middleware = (req, res) => {
  res.sendFile(path.join(__dirname + '/index.html'));
}

app.use(express.static('public'));

app.get('/', middleware)

app.get('/page1', middleware)

app.get('/page2', middleware)

app.get('/page3', middleware)

app.listen(3000, function () {
  console.log('Example app listening on port 3000!')
})

## package.json
{
  "name": "prueba_frontexpress",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.15.3"
  }
}
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<script src="https://cdn.jsdelivr.net/npm/frontexpress@1.1.0/frontexpress.min.js"></script>
	<title>Prueba Front Express</title>
	</head>
	<body>
	Probando <br />
	<a class="menu-item" data-id="page1" href="#"> page 1</a>
	<a class="menu-item" data-id="page2" href="#"> page 2</a>
	<a class="menu-item" data-id="page3" href="#"> page 3</a>

	<div class="content"></div>

	<script>

	// Front-end application
	const app = frontexpress();

	// front-end logic on navigation path "Root"
	app.get('/', (req, res) => {
	document.querySelector('.content').innerHTML = `<h1>Index</h1>`;
	});

	// front-end logic on navigation path "/page1"
	app.get('/page1', (req, res) => {
	document.querySelector('.content').innerHTML = `<h1>Page 1 content</h1>`;
	});

	// front-end logic on navigation path "/page2"
	app.get('/page2', (req, res) => {
	document.querySelector('.content').innerHTML = `<h1>Page 2 content</h1>`;
	});

	// front-end logic on navigation path "/page2"
	app.get('/page3', (req, res) => {
	document.querySelector('.content').innerHTML = `<h1>Page 3 content</h1>`;
	});

	// start front-end application
	app.listen(() => {
	// on DOM ready
	const menus = document.querySelectorAll('.menu-item');
	for (let i=0; i<menus.length; i++) {
	const menu = menus[i];
	menu.addEventListener('click', () => {
	app.httpGet(`/${menu.dataset.id}`);
	});
	}

	console.log('App is listening requests');
	});

	</script>

	</body>
	</html>
	const
	express = require('express'),
	app = express(),
	path = require('path');

	const middleware = (req, res) => {
	res.sendFile(path.join(__dirname + '/index.html'));
	}

	app.use(express.static('public'));

	app.get('/', middleware)

	app.get('/page1', middleware)

	app.get('/page2', middleware)

	app.get('/page3', middleware)

	app.listen(3000, function () {
	console.log('Example app listening on port 3000!')
	})
	{
	"name": "prueba_frontexpress",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",
	"scripts": {
	"test": "echo \"Error: no test specified\" && exit 1"
	},
	"author": "",
	"license": "ISC",
	"dependencies": {
	"express": "^4.15.3"
	}
	}