├── .env ├── src ├── vite-env.d.ts ├── static │ └── img │ │ └── logo.png ├── ts │ ├── routes.d.ts │ ├── vite-env.d.ts │ ├── layout.d.ts │ ├── nprogress.d.ts │ └── api.d.ts ├── sass │ ├── helpers │ │ ├── _bg.scss │ │ └── _iframe.scss │ ├── libs │ │ └── _nprogress.scss │ ├── pages │ │ ├── _index.scss │ │ └── _fetch.scss │ ├── core │ │ ├── _dev.scss │ │ ├── _spacing.scss │ │ ├── _colors.scss │ │ ├── _font.scss │ │ └── _trejocode.scss │ ├── components │ │ ├── _footer.scss │ │ └── _header.scss │ └── style.scss ├── App.tsx ├── utils │ └── session.ts ├── routes │ ├── Private.tsx │ ├── Restrict.tsx │ └── index.tsx ├── components │ ├── nprogress │ │ ├── Container.tsx │ │ ├── Spinner.tsx │ │ ├── index.tsx │ │ └── Bar.tsx │ ├── footer │ │ └── index.tsx │ └── header │ │ └── index.tsx ├── main.tsx ├── pages │ ├── Private.tsx │ ├── Restrict.tsx │ ├── NotFound.tsx │ ├── Layout.tsx │ ├── Index.tsx │ └── Fetching.tsx └── api │ └── index.ts ├── public ├── robots.txt ├── favicon.ico ├── icons │ ├── icon-144.png │ ├── icon-192.png │ ├── icon-32.png │ ├── icon-48.png │ ├── icon-512.png │ └── icon-96.png ├── sitemap.xml ├── manifest.json └── vite.svg ├── tsconfig.node.json ├── vite.config.ts ├── .gitignore ├── .eslintrc.cjs ├── .github └── workflows │ └── deploy.yml ├── tsconfig.json ├── package.json ├── index.html ├── README.md └── pnpm-lock.yaml /.env: -------------------------------------------------------------------------------- 1 | VITE_API_URL = https://reqres.in/api -------------------------------------------------------------------------------- /src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/icons/icon-144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-144.png -------------------------------------------------------------------------------- /public/icons/icon-192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-192.png -------------------------------------------------------------------------------- /public/icons/icon-32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-32.png -------------------------------------------------------------------------------- /public/icons/icon-48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-48.png -------------------------------------------------------------------------------- /public/icons/icon-512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-512.png -------------------------------------------------------------------------------- /public/icons/icon-96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/public/icons/icon-96.png -------------------------------------------------------------------------------- /src/static/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrejoCode/react-boilerplate/HEAD/src/static/img/logo.png -------------------------------------------------------------------------------- /src/ts/routes.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @description Tipado de las rutas 3 | */ 4 | 5 | export type TypeChildrenProp = { 6 | children: JSX.Element; 7 | }; 8 | -------------------------------------------------------------------------------- /src/ts/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | interface ImportMetaEnv { 4 | readonly VITE_API_URL: string; 5 | } 6 | 7 | interface ImportMeta { 8 | readonly env: ImportMetaEnv; 9 | } 10 | -------------------------------------------------------------------------------- /src/ts/layout.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @description Tipado del componente Layout 3 | */ 4 | 5 | export type TypeLayoutProps = { 6 | title: string; 7 | keywords?: string; 8 | description: string; 9 | children: JSX.Element; 10 | }; 11 | -------------------------------------------------------------------------------- /src/sass/helpers/_bg.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * @version 1.0.1 3 | * @author Trejocode - Sergio 4 | * @description Mixin para bakcgroundImages 5 | */ 6 | 7 | @mixin backgroundImage { 8 | background-size: cover; 9 | background-position: center; 10 | background-repeat: no-repeat; 11 | } -------------------------------------------------------------------------------- /tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "composite": true, 4 | "skipLibCheck": true, 5 | "module": "ESNext", 6 | "moduleResolution": "bundler", 7 | "allowSyntheticDefaultImports": true, 8 | "strict": true 9 | }, 10 | "include": ["vite.config.ts"] 11 | } 12 | -------------------------------------------------------------------------------- /src/sass/libs/_nprogress.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * @version 1.0.0 3 | * @author Trejocode - Sergio 4 | * @description Estilos del Spinner del NProgress 5 | */ 6 | 7 | @keyframes spinner { 8 | 0% { 9 | transform: rotate(0deg); 10 | } 11 | 100% { 12 | transform: rotate(360deg); 13 | } 14 | } -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- 1 | import path from "path"; 2 | import { defineConfig } from "vite"; 3 | import react from "@vitejs/plugin-react"; 4 | 5 | // https://vitejs.dev/config/ 6 | export default defineConfig({ 7 | resolve: { 8 | alias: { 9 | "@": path.resolve(__dirname, "./src"), 10 | }, 11 | }, 12 | plugins: [react()], 13 | }); 14 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /src/App.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * @description Punto de entrada de la aplicación 3 | */ 4 | 5 | import Routes from "./routes"; 6 | import { HelmetProvider } from "react-helmet-async"; 7 | 8 | const App = (): JSX.Element => ( 9 |
10 | 11 | 12 | 13 |
14 | ); 15 | 16 | export default App; 17 | -------------------------------------------------------------------------------- /src/utils/session.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @description Función para obtener la validación de la sesisón de usuario 3 | */ 4 | const verifySession = (): boolean => { 5 | const data = localStorage.getItem("session_token"); 6 | 7 | if (data) { 8 | return true; 9 | } else { 10 | return false; 11 | } 12 | }; 13 | 14 | export const sessionUtils = { 15 | verifySession, 16 | }; 17 | -------------------------------------------------------------------------------- /src/ts/nprogress.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @description Tipado del componente Progress 3 | */ 4 | 5 | export type TypeProgressProps = { 6 | isAnimating: boolean; 7 | }; 8 | 9 | export type TypeBarProps = { 10 | progress: number; 11 | animationDuration: number; 12 | }; 13 | 14 | export type TypeContainerProps = { 15 | isFinished: boolean; 16 | children: JSX.Element; 17 | animationDuration: number; 18 | }; 19 | -------------------------------------------------------------------------------- /src/sass/helpers/_iframe.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * @version 1.0.1 3 | * @author Trejocode - Sergio 4 | * @description Habilita los