Git Product home page Git Product logo

delta-hub-ts's Introduction

DeltaHub

A platform and cloud-based service for data sharing based on delta-sharing-rs using Next.js and TypeScript. Please refer to the Project Improvement Proposal.

Screenshot

Atomic Design

We have adopted the Atomic Design Methodology for structuring UI components, but some modifications are required. The original methodology primarily emphasizes a bottom-up approach starting from basic HTML tags. However, in our case, we use Chakra UI components as our foundational elements, equivalent to atoms in the original methodology.

The following list explains the guide-line how to structure of your components' hierarchy

  • Atoms

According to the original methodology, atoms should correspond to Chakra UI components, so there seems to be no need to implement atomic components in this project. However, we redefine atoms as undecomposable components in the context of the project. For example, a component that consists of one icon element and one line of text, such as menu items, should be considered a molecule from the perspective of the original methodology. Still, we treat it as an atom since we don't decompose it in our implementation. Of course, the atomic components from the Chakra UI are also considered and treated as atoms.

  • Molecules

Molecules are constructed from the atoms as explained in the previous section. A typical example of a molecule is a container component, such as lists and tables. Molecules do not differ from the original methodology, except for the underlying atoms.

  • Organisms

Organisms correspond to the so-called "areas" on a web page. For example, header area, footer area, main pane, left pane, and form areas.

  • Templates / Pages

Templates and pages correspond to the layouts and pages of Next.js. Hence, we don't prepare any designated directories for the templates' and/or pages' implementations.

DeltaHub Configuration

Name Environment Variable Required Description
nextauth_url NEXTAUTH_URL yes Your canonical URL
nextauth_secret NEXTAUTH_SECRET yes Your NextAuth JWT encryption secret
google_client_id GOOGLE_CLIENT_ID yes Google API client ID for OIDC
google_client_secret GOOGLE_CLIENT_SECRET yes Google API client secret for OIDC
github_client_id GITHUB_CLIENT_ID yes GitHub API client ID for OIDC
github_client_secret GITHUB_CLIENT_SECRET yes GitHub API client secret for OIDC
delta_sharing_base_url DELTA_SHARING_BASE_URL yes Delta Sharing RS Backend URL

Obtaining Authentication Credentials

To use Google's OAuth 2.0 with Delta Catalog via NextAuth, you will need Google's OAuth 2.0 authentication credentials, which include a client ID and client secret. Here is the process for obtaining them:

  1. Access the Google Developer Console.
  2. Create a new project.
  3. Create the OAuth consent screen.
  4. Register your application and obtain authentication credentials (client ID and client secret).

To use GitHub's OAuth 2.0 with Delta Catalog via NextAuth, you will need GitHub's OAuth 2.0 authentication credentials, which include a client ID and client secret. Here is the process for obtaining them:

  1. Access the GitHub Developer Settings.
  2. Create a new OAuth App.
  3. Create the OAuth consent screen.
  4. Register your application and obtain authentication credentials (client ID and client secret).

Getting the JWT Secret

NextAuth uses JWT (JSON Web Tokens) to manage sessions. The JWT secret is used for signing JWTs. It should be a random string. The following example demonstrates how to generate a JWT secret using the openssl command.

$ openssl rand -base64 32
IHPcQI71tUBPOJ7jxkRhjKRv7Ak5nvnz9xCZEPBeN8U=

delta-hub-ts's People

Contributors

dependabot[bot] avatar ognis1205 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

delta-hub-ts's Issues

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.