Giter VIP home page Giter VIP logo

manuelson / react-login-template Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 108 KB

A simple Login/Register Template with React and Tailwind CSS

Home Page: https://react.manugonzalez.com/

License: GNU General Public License v3.0

JavaScript 4.64% HTML 2.31% CSS 0.35% TypeScript 92.69%
react react-components reactui react-login react-router react-session reactjs react-hooks react-logout react-router-dom react-typescript typescript-react vite vitejs react-tailwind-css tailwindcss

react-login-template's Introduction

React Login Template

This document describes a login template in React that connects to a custom API to authenticate users.

Demo

https://react.manugonzalez.com/

Project Structure

The project is structured as follows:

  • src/
    • components/
      • Loader.tsx: This component handles loaders
      • Router.tsx: This component handles routers
    • layout/
      • Index.tsx: Contains the layout structure.
    • helpers/
      • transformers.tsx: Transform data from axios.
    • hooks/
      • useAuth.tsx: Hook for authenticate or logout the user
      • useLocalStorage.tsx: Hook for manage localStorage
      • useUser.tsx: Hook for manage User
      • useRegister.tsx: Hook create users
    • context/
      • AuthContext.tsx: This module provides the authentication context for the application.
    • compiler/
      • types.tsx: This TypeScript file defines all interfaces
    • App.tsx: This is the main component of the application.

Usage

To use this template, simply clone the repository, install the dependencies with npm install or yarn install, and then start the application with npm start or yarn start. Be sure to configure the URL of your custom API in .env file.

Versions

  • React 18.2
  • Vite 5.2
  • Vite react swc 3.5

Contributing

We welcome contributions to this project! Here are the steps to get started:

  1. Fork the Repository: Click the 'Fork' button at the top right of this page and clone your forked repository to your local machine.

  2. Create a Branch: Create a new branch on your local repository. The branch name should be descriptive of the changes you'll be making. git checkout -b your-branch-name

  3. Make Your Changes: Make the changes you want to contribute. These could be adding new features, fixing bugs, or improving documentation.

  4. Commit Your Changes: Commit your changes with a descriptive commit message. git commit -m "Your descriptive commit message"

  5. Push to Your Fork: Push your changes to your forked repository. git push origin your-branch-name

  6. Create a Pull Request: Go to your forked repository on GitHub and click the 'New pull request' button. Fill out the form and then submit the pull request.

Before submitting your pull request, please make sure your changes do not break the project. You can do this by running the project and checking if everything works as expected.

Thank you for your contribution!

react-login-template's People

Contributors

manuelson avatar

Stargazers

 avatar

Watchers

 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.