title: MEAN app. Two servers at the same time Express, NodeJS, Angular 2
body: <p>I try to connect backend (NodeJS, Express) with Frontend (Angular 2), but have a problem.</p>
  
  <p>When I start two servers separately, both client-side and server-side work fine.
  In my situation:
  localhost:4200 - Angular
  localhost:3000 - NodeJS, Express</p>
  
  <p>When I render any static html file in my VIEWS folder, it works correctly, but when I change the content of the html file to Angular Index.html, that uses components, it doesn’t work. I mean, it works, but doesn't load my components.</p>
  
  <p>I suppose that problem is in the configuration, and my index.html doesn't know how to find and load components, but I don’t understand exactly where a mistake might be.</p>
  
  <p>When I try to start both servers at the same port, my frontend part stops working.</p>
  
  <p>I use Angular-CLI, NodeJS, Express and EJS.</p>
  
  <p>My server.js code is:</p>
  
  <pre><code>var express = require('express');
  var path = require('path');
  var bodyParser = require('body-parser');
  
  var index = require('./routes/index');
  var tasks = require('./routes/tasks');
  
  var port = 3000;
  
  var app = express();
  
  app.set('views', path.join(__dirname, 'views'));
  app.set('view enjine', 'ejs');
  app.engine('html', require('ejs').renderFile);
  app.use(express.static(path.join(__dirname, 'views')));
  
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: false}));
  
  app.use('/', index);
  app.use('/api', tasks);
  
  app.listen(port, function () {
      console.log('Server started on port ' + port);
  });
  </code></pre>
  
  <p>In the ROUTES folder my index.js code is:</p>
  
  <pre><code>var express = require('express');
  var router = express.Router();
  
  router.get('/', function(req, res, next) {
      res.render('index.html');
  });
  
  module.exports = router;
  </code></pre>
  
  <p>My folders structure:
  <a href="https://i.stack.imgur.com/ZuOXZ.png" rel="nofollow noreferrer">Picture of foldes</a></p>
  
  <pre><code> node_modules
   routes
   ruen-app
   views
  package.json
  server.js 
  </code></pre>
  
  <p><code>ruen-app</code> is my client (Angular 2) folder.</p>
  
  <p>So, my questions are:</p>
  
  <ol>
  <li>How to connect these two parts?</li>
  <li>Is it correct to start two servers at the same time - one for the frontend, another for the backend?</li>
  <li>What is the best practice for MEAN applications to start from the scratch? I mean, what is the best way - two servers or one?</li>
  </ol>