NickA02 / SOTestingEnv

This project aims to create a web-based coding platform specifically tailored for Science Olympiad programming events.
2 stars 0 forks source link

Setup React Router #19

Closed id-mustafa closed 1 month ago

id-mustafa commented 1 month ago

Hello, this PR consists of the changes made to install React Router via their documentation - "npm install react-router-dom." I configured it for out frontend. Here are the key changes I made:

1) I setup a pages folder to house all the files that we've been working on.

2) The main.tsx folder is where React Router has been created and configured. The App.tsx folder now houses all the routes for the project.

If you would like to created a new page and add it to the app itself. You would need to create the file, and if you have intellisense for react snippets, you can run "tsrafce" to spin up a component/page.

Now move to App.tsx. Import the page from the component you had just created. and add the following underneath the Routes tag:

<Route path="[PATH THAT SHOWS IN THE URL]" element ={<[YOUR PAGE] />}

Then you're all set to continue development!

Notes: I had also setup Tailwind CSS and it was pushed into the project with Andrew's PR.

id-mustafa commented 1 month ago

Done, its in the README