Add React proxy configuration to README for CORS handling between frontend and backend#2
Draft
Add React proxy configuration to README for CORS handling between frontend and backend#2
Conversation
Co-authored-by: eklavyamirani <1318529+eklavyamirani@users.noreply.github.com>
Copilot
AI
changed the title
[WIP] Update readme to include proxy settings for handling core between frontend and backend
Add React proxy configuration to README for CORS handling between frontend and backend
Jun 7, 2025
eklavyamirani
requested changes
Jun 7, 2025
README.md
Outdated
|
|
||
| This proxy configuration allows your React app (running on port 3000) to make API calls to your .NET backend (running on port 5000) without CORS issues during development. | ||
|
|
||
| Alternatively, you can create a setupProxy.js file in the src folder for more advanced proxy configuration: |
Owner
There was a problem hiding this comment.
let's put this under the advanced configuration section
Contributor
Author
There was a problem hiding this comment.
Done! I've reorganized the setupProxy.js content under an "Advanced Configuration" subsection. Commit 7190ad0
| } | ||
| ``` | ||
|
|
||
| This proxy configuration allows your React app (running on port 3000) to make API calls to your .NET backend (running on port 5000) without CORS issues during development. |
Owner
There was a problem hiding this comment.
the proxy should come after setting up the backend application
Contributor
Author
There was a problem hiding this comment.
Done! I've moved the proxy section to appear after the .NET backend setup instructions (after the CORS configuration section). Commit 7190ad0
…onfiguration subsection Co-authored-by: eklavyamirani <1318529+eklavyamirani@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Updated the README to include comprehensive proxy configuration instructions for handling CORS between the React frontend and .NET backend during development.
Changes Made
Added a new section "setup proxy for react frontend to communicate with dotnet backend" that includes:
Simple proxy configuration via
package.jsonfor basic use cases:{ "proxy": "http://localhost:5000" }Advanced proxy configuration using
setupProxy.jsfor more complex scenarios:Clear explanations of the port configuration (React on 3000, .NET on 5000)
Installation instructions for required dependencies
Why This Matters
The existing README showed how to configure CORS on the .NET backend side but was missing the frontend proxy configuration. This addition provides developers with complete guidance for setting up communication between the React frontend and .NET backend without CORS issues during development.
The proxy configuration is essential because:
Fixes #1.
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.