Why do they make 2 different servers when building Gulp?

Question

JavaScript

I watch a video for beginners on React and Express.
The author of the video makes such an assembly of Gulpfile, but does not explain WHY he needs 2 different server plugins, while gulp-live-server is generally some kind of unpopular one, why use it here?

var gulp = require('gulp');
var LiveServer = require('gulp-live-server');
var browserSync = require('browser-sync').create();
var reload = browserSync.reload;

gulp.task('live-server', function() {
  var server = new LiveServer('server/main.js');
  server.start();
});

gulp.task('serve', ['live-server'], function() {
  browserSync.init(null, {
    proxy: "http://localhost:7777",
    port: 9001
  });
});

Those. it raises the gulp-live-server server, and then proxy traffic through browserSync. What for? What is the practical use of such a configuration? What can replace the unpopular gulp-live-server?
And in production, in general, Express should be used, a video course about it. So then why gulp-live-server, I don’t understand ...

Answer 1

it is so convenient for him)
in general, think about the name browserSync,
this is the synching of various browsers initially - and only then the server.
also not the fastest