None of my react components render when I use github pages. My CSS seems to work (I can see the background pattern) but none of my react components render. Everything works fine locally, but it does not when I use github pages. Here is a link to my repo: https://github.com/GibbsV3/MySite
I have tried using the Router component but so far I cannot figure it out. Is there something wrong with my index.html file?
Github pages works for static pages.
But react is not static page. Your index.html file interacts with javascript and adds contents, components.
There are some ways you can deploy react-app to github pages but I would recommend using vercel or netlify
You have to build a static page before deploying it to the GitHub page. Follow this LogRocket article.
Related
I am using "linaria": "^4.1.10" and "next-linaria": "^0.11.0" in my Next.js app. I have followed the configuration on this repo. In my app the pages which are not using getServerSideProps are working fine with above configuration, but the pages having SSR approach are not working fine.
Errors such as
Cannot read properties of undefined (reading 'localeCompare'),
EvalError: Cannot read properties of null (reading 'spawn')
comes up in the SSR components during build time.
Any help with the setup of Linaria with Next.js for SSR pages will be amazing to have. Or if you guys can point me to the correct docs.
I have tried the other setup on the Linaria docs, I have also tried the Next.js Example for Linaria.
Nothing seems to work for me.
This is the link to my GitHub project, see the directory structure: https://github.com/SutirthaDey/crowdcoin
app link: https://crowdcoins.netlify.app/
I have used react,nextJs, and next routes for dynamic routing. The problem I'm facing is after deploying it using netlify, everything is working fine but when I do a refresh, it's showing 404 pages not found(except the main index.js page/landing page). I don't know whether I was doing it appropriately but tried several things like using netlify.toml and _redirects but nothing really worked. Other than the refreshing part, everything is working fine.
I was stressing out for days over this its such unique problem that I couldn't find the answer too anywhere. I also followed the same Solidity tutorial as you and unfortunately the tutorial is very out of date so a lot of things don't really work. I had the exact same issue as you when trying to build on netlify. It took a while to figure out but basically the next-routes package does not work with netlify. So you will have to set up your routes just using vanilla Next.js. So delete the server.js and routes.js files then search up how to create routes using Next.js I would suggest these tutorials they are very good! Next routes tutorials. Hopefully this helps others I don't want anyone else to go through what I had to go through lol
Unfortunately I can't share the website in question, I just hope someone can steer me in the right direction without seeing either it or too much of the code.
The React Native(iOS only) app is built with;
react 16.0.0-alpha.12
react-native 0.47.1
The website is built with;
React 16.0.0
Babel is set up correctly, and babel-polyfill is baked in too.
Description
The use-case is that we need to load, say, the FAQs page from the company ReactJS-based site in the mobile phone app's webview component.
However, the webview does not load the bundle.js for the website. CSS, HTML ect loads, but not the React bundle. Running JS inline in a script tag as a test works, but only if I remove the bundle.js file from src.
So something about the ReactJS build does not play nicely when loaded in a RN Webview. The site loads just fine via the mobile phone browsers however.
The particular use case I'm looking at is running a single page application at the root path / of a domain, and having a statically rendered blog at /blog.
I've already checked out the advice at https://www.gatsbyjs.org/docs/path-prefix/, however I'm not entirely sure how this would interact with the React app running at /
Is there a way to get React Router in the React app to support handing over to Gatsby?
Gatsby is just React so yes :-)
Build your SPA & blog both with Gatsby. Put the entry to your SPA at src/pages/index.js and it'll be served at /.
If you need client-only routes, you can set those up like this: https://www.gatsbyjs.org/docs/creating-and-modifying-pages/#creating-client-only-routes
Gatsby is basically CRA with some additional features to make it easy to build websites.
So i had this thought about making a Jekyll SPA blog
and somehow make use of something like React.js / React Router or Vue.js / Vue Router to achieve that SPA routing feel.
Is it possible to achieve this, and if so where would i import and use the router ?
I don't think it's possible with Jekyll (I assume that you want to show in router-view component pages generated by Jekyll).
A better way would be creating a blog entirely in Vue (or React). When you push changes to Github repository, you should have configured Travis that will build the whole project and push to gh-pages branch.