My website is almost complete on next.js. I am trying to create widget to one of my component that can be embedded on any website without iframe. Please help me out
Use a Web Component Framework
First understand what web components are.
https://developer.mozilla.org/en-US/docs/Web/Web_Components
recommended frameworks
https://stenciljs.com/docs/introduction (made by Ionic)
https://github.com/github/catalyst (made by Github)
https://lit.dev/ (made by Google)
Your website being in next.js would not be a factor here. You should build your web component then serve it via CDN or via static folder in next.js. You could reuse your REST routes or styles etc. but you would want a proper modern web component.
Related
So i have this social media app with multiple pages, it's all created with create react app with context api and react-router for routing and laravel for backend. Now, google won't be able to index these dynamic pages, i have tried pre rendring the pages using react-snapshot, currently looking into next js.
i know react has this react dom server, will it be good idea to hook up another server just for pre-rendring the page before sending it to the client.
Is there any other way to do ssr with cra.
First things first, Google is able to index client-side rendered pages.
I think next.js is a good choice for SSR, but you can also look at razzle - maybe you can retrofit that to your CRA setup.
Google should index your website. please check your robots.txt file and also try to provide sitemap.xml for better crawling for google.
Also, there are some issues with using react-snap and that is you render the page at build time and your site render won't change if you read your content from the database and update your database while you didn't rebuild your app.
you can use after.js but next.js have a bigger community and more tutorials out there so I recommend you use next.js.
Also, there is a tool named prerender.io(open source) and you can serve rendered page to search engine bots this is the easiest way in my opinion and do not have the downside of using react-snap
I'm having a Laravel application with a VueJS frontend as a landing page (web tool). I've noticed it shows up on Google as a blank page as the content isn't pre-rendered. I've googled and found the solutions to pre-render the HTML more complex and work intense than I expected. Is there a simple way using Laravel Mix?
If a user has installed my PhoneGap app is there any way to update the static files such as the HTML or CSS with out the need to re-deploy the app again?
For example, when updating a web app, the developer can make a change to a CSS file on the server, and on the next page refresh the style change will be visible to the user.
I'm assuming being able to do this is unlikely due to the app needing to be packaged up and installed on the device, but I'm looking for some verification.
You could change the app to import the file externally from a server (something like <link rel="https://linktofile.com/file.css">, which means you can change the app's style at any time without re-compiling the app.
Otherwise I am not aware of any other way.
#Stavros_S
delopying a website as is suggested by Praveen Kumar is NOT best practice for mobile Apps.
Recently, Google created a new means to do what you want. It is called an Expansion File. Read this:
https://iphonedevlog.wordpress.com/2014/12/12/adding-an-android-apk-expansion-file-to-a-cordova-project/
I am tasked with updating a Microsoft Frontpage website and I am going to use Polymer with the Polymer Starter Kit. In that it uses a javascript router to handle pages. Now it will be hosted on an apache server and I know how to setup apache to route everything to my index.html file to get the router to do my routing, but I am looking for a way to also route to existing static pages as I work on the conversion of this website so I can release pages as I go and users can still access the old pages that I haven't converted yet.
Is there an easy way to handle this scenario?
am using page.js for routing in a Grails application using '/' to point /HomeController/index to serve up a single page web application. I just installed Grails Spring Security Core plugin, and I am using the Grails scaffolding to create the User Admin/Permissions views with the goal of serving them in the traditional multi-page way to avoid having to do a lot of UI work on admin pages. The bulk of the application will be served using single page architecture, with just the admin pages being served multi-page.
In their documentation, page.js says, "By default when a route is not matched, page.js will invoke page.stop() to unbind itself, and proceed with redirecting to the location requested. This means you may use page.js with a multi-page application without explicitly binding to certain links." But, I cannot get it to work...
I am using page.js like so:
page('/', SCM.Dashboard.home);
page('/hx', SCM.HX.summary);
page('/hx/vendor', SCM.HX.vendors);
page('/hx/customer', SCM.HX.customers);
page('/customer/list', SCM.Customer.list);
page('/maintenance/activity', SCM.Maintenance.activity);
page();
When I click a link to '/user', based on their documentation, I expect it to forward directly to 'http://domain.com/user'. It adds the correct path to browser location bar (http://domain.com/user), but the browser never forwards to the page. In order to see the page, I have to click the link, and after the location bar has changed, if I refresh the browser window, the correct page appears - obviously unacceptable. Yet, I cannot find in their documentation how to implement this correctly. I have experimented with various settings for hours with no luck. If I comment out the page.js code above, the multi-page admin pages work fine, and I am able to navigate from page to page no problem. Has anyone solved this problem?
I just upgraded from version 1.4.0 to version 1.5.0 and it links between the Single page (Main app) and Multi-page (Admin functionality) portions of the application seamlessly with no configuration needed!! Excellent feature addition!