TypeScript

Typed JavaScript superset

src/app/projects/page.tsx

interface Project {
  _id: string
  company: string
  startDate: string
  endDate: string
  title: string
  description: string
}

const Projects: React.FC = () => {
  const [projects, setProjects] = useState<Project[] | null>(null)
  useEffect(()=> { ...
  }, [projects])
  return ( ...
  )
}

TypeScript for static types

In the context of web development, I often choose TypeScript, because it provides static typing, which catches mistakes early on in the development process and makes code more reliable and maintainable. This makes it easier to write and maintain large-scale applications, making it a better choice over Javascript for complex projects. As it is shown above, I've created an interface Project for defining the structure of the project data. Also, I've annotated the projects state with the Project[] | null type to indicate that it can either be an array of Project objects or null.

Reference