solution • React TypeScript coding - martindubenet/wed-dev-design GitHub Wiki

React TypeScript coding  ][  React JSX templates  ][  React MUI component library  ][  Gatsby.React on Netlify  ]

React coding

React Router is a popular library for managing client-side routing in React applications. It allows you to create complex, multi-page web applications that feel like traditional websites while still being single-page applications (SPAs) under the hood. With React Router, you can define and manage routes, enabling users to navigate through different views of your application without having to request a new HTML page from the server.

Using React Router to make content visible only if the URL contains localhost

  1. Google Gimini = https://g.co/gemini/share/ab9b8348a7d9
  2. Stackoverflow : How to setup react-router to work on localhost and deployment URL under path

 

Models.ts

Export methods

  • Type : export type PropertyName {}
  • Interface : export interface PropertyName {}

Github Copilot = Both interface and type can be used to define object types in TypeScript. It ultimately depends on your personal preference and the specific requirements of your project.

 

Models.tsx

Importing

import {
  Paper,
  SvgIcon,
  useMediaQuery
} from '@mui/material';
import {
  CloseFullscreen as CloseFullScreenIcon,
  OpenInFull as OpenInFullScreenIcon
} from '@mui/icons-material';

 

Dev tips and tricks

When you get EsLint errors in VS Code Editor view:

  1. Position your cursor hover that (red underlined) error and click ⌃Ctrl+.,
  2. The pop-up will appear with a list of proposed actions to click to fix this error.

 

 

⚠️ **GitHub.com Fallback** ⚠️