Fullstack GoLang React Insanity Volume 2

Explore building a fullstack app with React and Go, focusing on web sockets and rest api, including Mongo and sequel databases, admin panels, and a React frontend workflow.

Explore building a huge react context state with hooks and the context system, and see a full interactive terminal that runs PTI terminals.

Launch and test the Docker image by installing Docker on Ubuntu, pulling the image, and running a React app with a Go development environment and Mongo and MySQL support.

Acquire a domain name, check availability, and purchase it; then set DNS records to map the domain to your server's IP address and set up a live Ubuntu server.

Set up a fresh ubuntu server with a domain, install nginx, configure sites-available and sites-enabled, obtain Lets Encrypt SSL certificates, and test a hello world index page.

Install MongoDB and MySQL on Ubuntu, set up phpMyAdmin, create an admin user, and enable authorization to secure MongoDB and MySQL installations.

Install node and go on the server, configure environment paths, link node and npm, set up the go workspace, and verify with a hello world program.

Install on Ubuntu 19.10 server, generate a password with OpenSSL, adjust the bind address to expose to the outside world, enable authentication, restart the service, and verify via CLI.

Set up a React app with Node.js, parcel, and babel, organize components and fonts, and serve via nginx while linking to a Go backend.

Recap video walks through wiping and provisioning a server from ground zero to the first React app, detailing HTML and index files, nginx, and Mongo and MySQL setup.

This recap covers provisioning a server for Go and Node, installing them, and getting a first React app running with Parcel, including Node version troubleshooting.

Begin the fullstack go-lang react insanity volume 2 with initial setup: install react-dom, components, react hook router, axios, and react-json-view, create a hello world app, and organize a project directory.

Learn to set up a two-column react grid with styled components, install react router, and arrange navigation header, content header, with a console area spanning both columns.

Learn to build a six-panel grid layout, create a reusable styled button component, and implement a router with navigate and use roots to render content in the main area.

Demonstrate React routing and navigation by adding navigation titles and a dashboard component, replacing hello world with a dashboard, and wiring the app context state for route-based display.

Wire up the app context to display on the dashboard by creating a context, wrapping the main app with the provider, and exposing state via the context hook.

Polish the content header login in a GoLang React project, style the login button, wrap components with fragments, and lay groundwork for a websocket login workflow.

Move websocket logic into the app context, implement a request function and heartbeat, configure on open and close events, and expose the websocket id for client-server communication.

Learn how to bootstrap a Go websocket server with gorilla/websocket, set up a router and routes, generate unique IDs, and configure TLS with Let's Encrypt.

Set up a new redis package in the go project, fetch the go-redis client with go get, initialize a Redis client on startup, and ping Redis to verify the connection.

Set up a Go config package and an async queue to manage web socket tasks via Redis, initialize workers, and create a web socket connection pool.

Set up an internal websocket manager in Go and build a fat client pool to register and track connections, with data packages to structure and send internal messages.

Wire up a client-side and server-side login using an app context to manage user and password, base64-encode credentials, and request JWT tokens, integrating with the websocket flow.

Wire up the server-side utils package in Go, decode base64 user data (email and password) to plain text, test login, and prepare to store the user in Mongo.

Create and seed a Mongo database by adding an admin user, then use the test utilities to generate and encrypt the initial password for authentication.

Wire up the MongoDB server side by configuring the host, username, password, and database, initialize the MongoDB client, and implement a user lookup by alias or email with password validation.

Integrate a jwt package to generate a get-jwt-token and send it over a websocket while marshaling user data to json and removing the password using a private key.

Generate RSA public and private keys and integrate a JWT package. Build CRUD file operations and a robust config to manage keys.

Test user authentication by generating a jwt from the private key, extracting the user from Mongo, and validating the jwt while storing the jwt and user data in client state.

Validate JWT on the client and server by storing and validating tokens in local storage, manage state for verified tokens, and handle login flow with valid and invalid credentials.

Logging in stores the JWT in local storage and updates the app context on reload by verifying the token, setting the user, and loading defaults, while avoiding redundant state resets.

Set up a logout flow that clears the verified JWT, resets user state and valid credentials, and removes the token from local storage after login verification.

Configure footer console tabs by adding a slanted tab button and a console tab state, then update the main app to switch views based on the selected tab.

Learn to connect console tabs to dynamic content areas by rendering interface or web socket content, and style the active tab for the buckets.

Implement rest and websocket message buckets, export them for display on the main app, update on events, and render colored messages in the front-end console with tab-driven visibility.

Explore a command input and keyboard indicator system that interprets commands, updates the current command state, and can send arbitrary commands to a server, with shift detection and keyboard listeners.

Wire up a keyboard listener within the context system to drive keyboard indicators and halo controls, handling shift, arrow, and enter keys for interactive state updates.

Build halo ui in react by wiring a left column with an input group and switch and scene with a wheel, styled components, and props for zoom, angle, and transitions.

Build halo part ii by creating and wiring halo components, including an input group, switch, and an icon-link button, inside the app context and state, with imports, routing, and compilation.

Download the blueprint icons zip from GitHub, drop the icons folder into your project, and use the 20px and 60px icon sets in buttons.

wire keyboard controls to apply halo zoom and rotate, translating elements and updating the halo index through app context and state management.

Hook up FilePond in a React app to upload files to a Go REST API, implementing a file upload route, JWT-authenticated requests, and server-side file handling with a FilePond integration.

Explore building an admin panel that connects to mongo and my sequel, then test a rest route and update a rest message bucket with JWT token validation results.

Fixes to app performance by validating jwt tokens and preventing invalid stored data. The update includes safer message handling, test form adjustments, and state management improvements.

Create and wire a MySQL package in a Go app, configure the MySQL user parser, install the driver, and initialize the connection during app startup.

Prepare admin user forms for Mongo and MySQL by building two separate user form components inside the admin panel.

Build the admin create users form by creating select and text input components, wiring React form handling, and scaffolding backend calls for Mongo and MySQL with JWT authorization.

Builds an admin create users form, integrating Mongo and my sequel databases, using a React form hook for input registration, validation, and a password strength indicator with error handling.

Build and validate the admin create user form with required first name and password, enforce min lengths, and wire API calls to Mongo and MySQL using a reactive form module.

implement the admin create mongo user rest route in the rest api, validating authentication tokens, checking that email and alias are unique, and inserting the new user document into Mongo.

Learn how to implement a MySQL user creation rest route in a full-stack setup, posting user data, inserting into the users table, and verifying the generated user ID.

Explore building a flex-driven React component using style components to dynamically adjust direction, width, and container width, and observe live updates with state variables and basic animations.

Explore dynamic animations by building a React component and a style component that control transforms via state, applying scale, translate, rotate, and skew with transitions.

Set up the proton package on the server, create a JWT-protected WebSocket route, and upgrade to a fast, input-driven shell with a tailored file system.

Build a client side shell interface using React components, connecting to the server via WebSocket with JWT in the authorization header, featuring an xterm terminal and context-based auth.

Configure the server-side filesystem package (fsa) to read, write, create, and delete files, exposed via a new rest route and web socket communication.

Build a React front end for the file system, wiring axios to the backend with JWT, rendering path data for directories and files, and updating on directory clicks.

Build a ws client manager interface and wire a server-side web sockets pool to publish a live client list, with rest api or web sockets messaging.

Build a redis interface by extending the websocket-driven console, reusing the shell component, and wiring the app during testing with parcel. Plan for monitor mode and a future per-interface UI.

Learn to wire up MySQL and Ace Editor in a React client, fetch databases and tables via REST or WebSocket, and render data as tables and collections.

Build a MySql admin interface in a React app, implementing tab navigation, on-click handlers, database and table fetching, and a data editor with file-based loading.

Develop and test MySQL backed REST routes, handling dynamic route parameters and template strings in a GoLang environment. Build, query, and marshal results for databases, tables, and rows via REST.

Wire up a Mongo admin React interface, configuring a left-right grid layout, routes and context, and set up the early rest api integration next.

Connect the interface to the Mongo driver, expose REST routes to list databases and collections, and support create and get document operations, using Go and the MongoDB driver.

Explore building a subdomain enumeration module by creating a targets interface backed by a Mongo REST API, with domain and IP targets and real-time updates via web sockets.

Polish off targets enum module demonstrates wiring domain enumeration with a REST API for domains and a WebSocket for targets, showcasing a hybrid Go and React approach.

Learn to build interactive decision trees with a react flow chart library, install and customize nodes and ports, and create dynamic json flow charts for go concurrency ideas.

Polish off the React flow chart by wiring a resizable chart, resolving compile issues, and planning to save nodes and links as a Mongo document for dynamic React forms.