Giter VIP home page Giter VIP logo

website's Introduction

Elite Website

The best way to check a player's farming skill/weight in Hypixel skyblock.

https://elitebot.dev/

Still under development

Developing

Note that this website requires the backend API to be running as well. You can find the repository for that here. You can use the actual API at https://api.elitebot.dev, but your access to that will be limited by the ratelimiting policies, and won't be suitable for work with any authenticated routes. (An included docker container for the API is planned for the future)

  1. Download the code, open the project, and run pnpm i to install dependencies

  2. Create a copy of .env.example, rename it to .env and fill out all the fields with the relevant values.

    a. DISCORD_CLIENT_SECRET and PUBLIC_DISCORD_CLIENT_ID are values found in https://discord.com/developers/applications. You'll have to create a new application, then go to the pictured location to copy these values. DO NOT SHARE YOUR CLIENT SECRET ANYWHERE.

    b. Other values in the .env file can be kept as-is for local development.

  3. Back on https://discord.com/developers/applications, you'll have to add redirect URIs in the dashboard in order to have authentication work. For local developement, add the following:

    http://localhost:5173/login/callback
    http://localhost:3000/login/callback
    

    image

  4. Make a copy of your new .env file and rename it to .env.production. You should have both. You can ignore the production enviroment file for running in dev mode, it just needs to exist.

  5. Run the website in dev mode with the following:

    pnpm run dev
    

    Navigate to the link sent in the terminal, and it (should) load!

Building

To create a production version of your app, follow these steps.

  1. Follow steps 1-5 of the above development steps, you should then have a .env.production file to edit.

  2. Edit your new .env.production to use the port 3000 (or one of your choice, but be sure to change the port directive in the docker-compose-prod file as well).

    ORIGIN="http://localhost:3000"
    PUBLIC_HOST_URL="http://localhost:3000"
    

    Ensure that you have the port 3000 redirect uri in the Discord application settings on the developer panel mentioned above.

  3. Start up the production build with the following command:

    docker-compose -f docker-compose-prod.yaml up --build -d
    

    You can now navigate to http://localhost:3000/ to view the site.

In order to deploy this site to an actual domain name, you'd have to change the ORIGIN and PUBLIC_HOST_URL to your domain name, and follow a tutorial elsewhere and point to this address with something like nginx forwarding.

If you have questions, feel free to join the support Discord server

website's People

Contributors

ptlthg avatar alan72104 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.