Frontend programming questions

1. Writing output to UI (to terminal, or changing visual component), sending data to server are side effects. Hence most of the UI events handler functions are side-effect functions (as they change visual components or send-retrieve data from server), they are not pure. Computer programs always consist of pure and side-effect functions. Having a side-effect functions in code is not a mistake. The mistake is to use a side-effect fn in places where pure functions can be applied.
2. JSX is a template engine that simplifies writing HTML markup in JavaScript code. Markup of the component and programming code that operates those components (hides/shows the visual element, populate component by data) have to be separated in different files. Otherwise this is PHP-style programming. Good examples of frameworks that separate DOM markup from JS functions are Angular 2 and Salesforce Lightning Web-Components.
3. PubSub is a server-side integrational pattern. It is intended to implement load-balancing through redistributing messages over components. Observer is a Model-View-Controller pattern originally intended for programming User-Interfaces in order to mitigate components interdependencies. Observer pattern introduces an intermediate Event that you can subscribe-or-unsubscribe without any intermediate broker that catches those events like the PubSub pattern does. Using PubSub instead of Observer (like it is done by Dan Abramov in Redux) is a an architectural mistake. There is no point to group event processing handlers in one place of a program, or to catch event messages in switch-case constructs in order to pass them forward to handlers (reducers in React/Redux).

Hope it makes sense.