Skip to content

mace-stev/hands-off-server

Repository files navigation

This is the repo I used to create my website located at the link above. I created this site in order to help one of my favorite content-creators prevent from getting their streams stolen by bots. The idea of the site is to quickly and securely upload a stream as soon as the stream ends while still providing some customization for the streams.

Supported Platforms

Currently the site supports OBS, YouTube, and Twitch.

Technology Used

Frontend

  • React: A modern JavaScript library for building user interfaces. It allows for creating dynamic and interactive web applications.
  • React Router DOM: Enables seamless client-side routing for easy navigation between different pages within your application.
  • SASS: A powerful CSS preprocessor that streamlines writing maintainable and efficient styles.

Backend

  • NodeJS: A highly efficient JavaScript runtime environment that empowers server-side operations. It enables your application to process data, communicate with databases, and handle user requests.
  • Express.js: A popular web framework for building scalable and secure APIs. It simplifies setting up server-side logic and handling different routes within your application.
  • MySQL: A robust and reliable database management system for storing your project's data securely and efficiently.
  • Knex.js: A powerful query builder for interacting with your MySQL database with ease. It reduces the need for writing complex SQL queries directly.
  • JWT: Enables secure authentication and authorization mechanisms for users accessing your application.
  • OBS: I specifically used the OBS-Websocket-JS library which is a dedicated library for controlling OBS Studio through WebSockets. This facilitates seamless integration with streaming software within your project.
  • Axios : Simplifies making HTTP requests for fetching data and interacting with APIs from your backend code.
  • bcrypt: Provides secure password hashing for protecting user credentials stored in your database.

Looking back

This project is my capstone for the coding bootcamp Brainstation; we were originally only given like a month to complete them or at least make something presentable, but I'm only just now comfortable showing this project. Going into this I had no idea how difficult this would be especially because I feel like as a consumer I take a lot of things I interact with for granted. Youtube for example, the UI makes things like uploading a video deceptively easy, but uploading videos via Youtube's API without their libraries providing functions to do everything proved to be pretty difficult to say the least. The technologies I was experienced with going into this were Node, Express, MySQL, Knex, Axios, React, and Sass, but I had to learn everything else from scratch; I'd say the most challenging things to learn had to be using websockets and especially anything having to do with security like ssl, JWT, tunneling, wss, state variables, and access tokens simply because most of the time when something wouldn't work the issue would turn out to be a security issue such as chrome requiring websockets to connect with wss.

Demo

https://youtu.be/JMVAm1Lmdyc

About

Repo for my website I made to help content-creators quickly release their content.

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published