DEV Community

Best Resources For Web Developers 💻 [HTML + CSS + JavaScript]

ishrat on November 08, 2023

Here is a list of 24 valuable resources for web developers, covering HTML, CSS, and JavaScript. Keep in mind that there may be newer res...

Read full post

Raul Ferreira • Nov 9 '23

wow, what an explosion of relevant content, I knew some, but some were great finds, thank you very much for creating an article with links and a brief explanation, thank you very much for sharing your knowledge 🦤.

ishrat • Nov 9 '23

my pleasure :)

Adam Marsden • Nov 9 '23

I'd love to recommend my newsletter too, Unicorn Club 🦄

5-minute bite-sized weekly newsletter for design-savvy front-end devs and code-loving UX/UI designers. Filled with the best hand-picked resources. 100% free.

Subscribe for free

ishrat • Nov 9 '23

I will surely check it! :)

Lokesh Prajapati • Nov 11 '23

Hello, I'm fresher and I had created a dynamic react app with ms sql in that I'm facing issue as after production build it's looks good but after refreshing or reloading the same page getting error as 'can't get /login' can suggest some solution Thank you!

ishrat • Nov 11 '23

It seems like you're facing an issue with routing in your React app, particularly when reloading the page. The error message "can't get /login" suggests that the server is unable to find a route for the "/login" path.

Here are a few steps you can take to troubleshoot and potentially resolve the issue:

Check Your Server Configuration:
Ensure that your server (backend) is correctly configured to handle routing and is set up to serve the React app correctly. Make sure that it can handle routes like "/login" and that it's not expecting a physical file at that location.
Use HashRouter instead of BrowserRouter:
If you are using BrowserRouter from react-router-dom, try switching to HashRouter. HashRouter uses the hash portion of the URL (e.g., http://example.com/#/login) to maintain the application state. This can help with page reloads, as the part after the hash is typically handled client-side.
```
import { HashRouter as Router, Route, Switch } from 'react-router-dom';

// ...

ReactDOM.render(
  <Router>
    <Switch>
      <Route path="/login" component={Login} />
      {/* other routes */}
    </Switch>
  </Router>,
  document.getElementById('root')
);
```
Set up Proper Routing on the Server:
Ensure that your server is configured to serve the same index.html file for any route. This is known as a catch-all or wildcard route. In many server frameworks, you can achieve this by configuring your server to always return the index.html file for any route. This ensures that the React app takes over routing on the client-side.
Check Your package.json for homepage Configuration:
If you have set the "homepage" field in your package.json, make sure it is correctly set, especially if your app is not deployed at the root of the domain.
```
{
  "homepage": "https://yourdomain.com/your-app",
  // ...
}
```
Check for Typos and Case Sensitivity:
Ensure that the paths specified in your React Router components match the paths expected by the server, and that they are correctly spelled and cased.

After making these checks, you should be able to identify and resolve the issue. If the problem persists, you may need to provide more details about your project structure, server setup, and routing configuration for further assistance.