I write my first Gatsby Page. I also use Laravel as backend server.
In my project i have many slug pages. I used createPages and api connection to create them. User can add files like images, audio files and pdf. When it happen, page should change a bit content and show this file on specify address. Develop version works fine (i bind button to start npm run refresh). I used gatsby refresh endpoint and add to scripts:
"refresh": "curl -X POST http://localhost:8000/__refresh"
And it's work fine. But i don't know how change this to use it properly on production build. Can anyone help me? Thanks
The ENABLE_GATSBY_REFRESH_ENDPOINT environment variable is only working on development. According to the documentation:
During local development, it can be useful to refresh sourced content
without restarting the development server. To facilitate this, Gatsby
exposes an environment variable called ENABLE_GATSBY_REFRESH_ENDPOINT.
What you need is called a webhook. Basically, a webhook is a way for an application to trigger a change that happens in real-time in a CMS.
Each CMS has its own way of implementing webhooks, but the idea is to trigger a build process once a change in your CMS occurs.
Related
I have a React project that uses Strapi on the backend. I want to create a static version of the project that works completely offline. The offline version will just have read-only features e.g. viewing articles. By completely offline I mean I should be able to put the related HTML/CSS/JS etc. files in a folder, send it to someone and they should be able to click on index.html and start using the app.
I am thinking of looking into Gatsby but I was wondering if what I am describing is possible at all?
Check the build process of React.
You can easily run the built app completely offline, but you must reckon that no API request will work (unless you run your Strapi server locally as well). At this point, I should add, that you can run your app locally and if you have an internet connection, all requests should work correctly.
You can indeed, there's a plugin to do it (gatsby-plugin-offline) but you can achieve the same result manually.
The tricky part relies on avoiding API requests since they won't work. Having a CMS like Strapi or others doesn't make the difference because Gatsby fetches the data at the build time, no matter the source.
The previously mentioned plugin adds drop-in support using Workbox Build and precaches the pages to make them available without a connection, in your gatsby-config.js add:
plugins: [
{
resolve: `gatsby-plugin-offline`,
options: {
precachePages: [`/about-us/`, `/projects/*`],
},
},
]
You can customize the plugin by adding or inserting different files depending on your needs.
I would like to develop a Go application with a ReactJS "GUI".
My point is to launch a single binary "app" that launch a server at "localhost:someport" serving a ReactJS app.
I would like my actions in the ReactApp to be taken into account in the Go-side app.
I can do a Websocket-based ReactJS-Go application but I'd like everything to be bundled into a single binary.
I've followed this : https://medium.com/#esslamben/serving-static-sites-with-go-55bfc1ae4495.
This tutorial helped me to serve static files (a React App) with a single file.
But, I don't know how to continue to satisfy my wishes.
The thing I would like to achieve is the behavior like the old "RethinkDB".
When you run "rethinkdb.exe" in command line, it notifies a administration panel is running on 8080 port.
Navigating through localhost:8080 enables to administrate the database with a web-based GUI.
Does someone have advice to help me to obtain such a behavior?
You cant make binary for your React code , it should be copied
Your react built code (I assume static ) and put it in a specific path
Use Go http FileServer handler to serve the app as static one.
This might work or may not , I am not sure what are the bindings which is necessary should alos be copied. (your node modules and additional libraries you use it in your package.json)
Put your *.js binary data inside an HTTP handler to serve the client.
Store your js file as an []byte inside your application.
I create a new site using the gatsby-cli. Then I just build the site, then, all the content that is inside the build I copied to my AMPPS/www/my-site folder. When I access to the site, the index works correctly but when I click on a route to go to another route I got the following error: The requested URL /page-2/ was not found on this server..
I understood that gatsby will generate an static HTML site, and the production server where I need to place the build only accepts an static HTMl site. So is there a way to achieve a truly server side rendering with gatsby?
Thanks in advance.
The solution is quite simple:
If apache serves ampps/www/my-site as http://localhost/my-site you need to use path-prefix, by default gatsby assume it will be hosted at root of domain.
To enable this features, we just need to use the following documentation: https://www.gatsbyjs.org/docs/path-prefix/
I am having an issue where my grunt build file is building correctly, but the website I'm working on is not getting all of the css files. It is only getting the master.css file. I'm using nodejs, with kraken, on top of express. I can't tell if there is some configuration option I need to change, I don't really know where I would do that.
For anyone interested, the issue was with the changing structure of the project. Going from angular to a dustjs w/ backbone combo changes the project form a SPA structure to a multi-page structure. This makes a huge difference because now instead of sending everything at once we are sending pages as they are needed, this also means that when a user switches to a different view, the server will be building an html version of that view and sending it back as fully fleshed out html. When the server builds the page it has access to the file structure, which means that the build folder that was necessary for the angular project, is no longer necessary.
I'm trying to host my first website. I've made it using angularjs, bootstrap and yeoman as a generator. However when I tried to upload it, I realized that the full size of everything in my folder (including the generated stuff by yeoman) was nearly 100mb.
What files do I actually need to host? Node is nearly 60mb and grunt isn't much smaller. Any advice would be greatly appreciated.
Assuming you have a web server like nginx or apache already on that server, you just need to upload the dist folder that is created when you run grunt build.
You don't need all that generator and node stuff just to host a simple test project.
What you actually need is a single HTML file, called index.html. Include Angular and bootstrap (you can omit this, too, if you can go without fancy styles) and create a file app.js which will hold your application logic.
http://angularjs.org shows this in a neat way on their landing page, just scroll down to 'The basics'
As static angularjs application will contain mainly HTML, CSS and JS files you can host your project on simple apache webserver. (Apache - http://httpd.apache.org/)
If you are making a dynamic angularjs application you will have webservices returning you JSON data. If you implement the restful webservices in Java (using Jersey) you can deploy you entire angularjs application with java webserivce implementation to tomcat web server. (Tomcat - http://tomcat.apache.org/)
Hope this helps!
Decided to answer this old question because its one of the few that show on google when searched.
You do not need to use Grunt anymore, I do not know if this was needed at the time of this question.
instead just do
ng build my-app
this would have saved me some hours.
link to current doc