Skip to content

Example of how to use React Hooks in a project created with `dotnet new react`

Notifications You must be signed in to change notification settings

sethreidnz/dotnet-new-with-hooks

Repository files navigation

Dotnet new with Hooks

I created this repo to learn how to use React hooks by using the dotnet new react command.

What have I done?

The main things that I did after creating the project are:

  • Update the file ClientApp/package.jsonto be the same as the latest version created by Create React App (currently using react-scripts = 2.1.3). This includes updating everything and removing any unneeded scripts and dependencies. I also added the eslint hooks plugin to the package.json eslint config.
  • Moved the page components from ClientApp/components into a folder ClientApp/pages/
  • Re-wrote the component ClientApp/pages/Counter in a new hooks based component ClientApp/pages/CounterHooks
  • Re-wrote the component ClientApp/pages/FetchData in a new hooks based component ClientApp/pages/FetchDataHooks
  • Updated the navigation to link to these for comparison

To find out more about hooks start with the official react documentation: Hooks at a glance

Pre-requisites

Getting started

You can run it from Visual Studio Code or the command line which will install all the NodeJS and Dotnet Core packages and then run both of them together.

Visual Studio Code

You can run the project by opening it in Visual Studio Code and pressing F5.

Command Line

Run the following from the root of the repository:

Note: You will need to also set the environment variable ASPNETCORE_ENVIRONMENT to Development on your machine. See here for Windows and here for MacOS

dotnet run

More information

For more information see

About

Example of how to use React Hooks in a project created with `dotnet new react`

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages