How to dynamically replace contents of HTML tags with Python on Google App Engine with lxml? - google-app-engine

I am using Google app engine and python to build an application. I am incredibly new to python as well as GAE. I have a index.html file with the basic template for my site. However I would like to replace the contents of a few tags depending on the URL. For example update the title tag for each individual pages. From what I can tell the recommended way to do this is using the lxml library.
And so... Tonight is my first time I have ever worked with lxml and I am having a really hard time wrapping my head around it. I have been fooling around with several permutations of the basic syntax and have not had much success understanding how it works. I have looked for different tutorials and the documentation is few and far between.
When I try the following code I get a 'lxml.etree._ElementTree' object has no attribute 'find_class' error, however the documentation here: http://lxml.de/lxmlhtml.html#parsing-html it sure looks like it should have that class
Am I on the right path? Is this the most efficient/best way to replace the content of html tags?
import os
import webapp2
import lxml.html
doc = lxml.html.parse('index.html')
doc.find_class("title") == 'About Page'
self.response.write(lxml.html.tostring(doc))

This is definitely not the way to that on Google App Engine. You should use some kind of template framework like Jinja2 or Django to achieve your goal.
But before all that you will have to make sure that you completed the Getting Started Tutorial, where you can see these things in action.

Related

How to add a Docusaurus website within Next.js Website as a route

Does anyone have any pointers on how to go about adding a /docs page for website documentation to a next.js app? I've looked up Docusaurus but it seems like it's already a react app itself. Is there a way to integrate it inside an existing next.js app or are there other solutions?
Many Thanks
One idea might be to intercept the request and send the html file that docusaurus builds out, and putting all other files in the public folder.
https://medium.com/wesionary-team/render-html-file-in-pages-of-next-js-59281c46c05
Also checkout this discussion about it.
https://github.com/vercel/next.js/discussions/12373
I have done this with React apps using express. But never with Next. At first it looks like it would be possible with multi-zone in Next but that doesn't seem to do the job. So my other recommendation would be to try to use a docs.domain.com instead and host it separately. Then you have a /docs url or a button that redirects to the doc domain instead.
Firebase has free hosting and allows you to setup multiple sites. So it should be fast to test this setup there
I'm going to actively try to get this to work with Next myself but I do not think it will work because of how they are developed. So I would do the above recommendation and if I find a workaround, I'll post an update.

Is it possible to save a react Js rendered page to html and / or pdf server side?

This is more of a general question, hence I'm not including any code.
I've looked at quite a few options for both pdf and html, but haven't figured out a good solution.
I'm trying to take the output of what would be rendered by reactJs in a browser and save it to the hosting server instead of (or as well as) displaying it in the browser.
Specifically I'm generating a report using a pretty standard React functions, styled with css, and want to save that report upon rendering to the server.
The API which I also control is Django based.
I've looked at react-pdf/renderer, react-pdf, pdfkit on the Django side (w/wkhtmltopdf), reactdomserver to generate static html files, but can't quite piece together a solution.
Would love some feedback if anyone's done something like this before.

AngularJS - i18n and lang in the URL

I am currently on a project that needs to be multilingual.
The project is based on a PHP server (could'nt use NodeJS) and the front-end is written with AngularJS.
Right now, my language is only set by a cookie, and my whole application is translated by angular-translate.
For SEO purpose, I would like my URL to look like:
www.mywebsite.com/LANG_PARAMETER/anypage
I don't really know how to combine AngularJS with URL rewriting or anything else like this, I am searching since yesterday but couldn't find any track to follow.
I think that ui-router could fit my needs, but I haven't time to rewrite my whole application using this module (it will be done later).
So if you have any idea...
Thank you!

Setting up example app within directory path

I have a Shopify store, which uses the liquid templating engine. I'm trying to setup a blog on within this site / theme.
I would like to design the blog with angular. The blog has it's own directory within the site, and it's not on a subdomain of it's own.
http://holstee.com/blogs/themes
http://holstee.com/blogs/themes/111111-article-title
I'm wondering if this is something that can be done with angular, and why it's the example that's up isn't binding? Is it a base url thing?
If your wondering why your example on that page isnt working, bring up your Javascript console (Command + J) and you'll see the error. You need to initialize the myApp module.
Something like
angular.module('myApp',[]);
The error can be found here:
http://tinyurl.com/mbvhc5a
And to answer your question, yes you can use angular for your blog, but the question is more likely to be is it the right choice? For most blogs, the answer would be no, unless your planning a high amount of user interaction with the UI.

automatically import modules for App Engine interactive console

The interactive console accessible at localhost:8080/_ah/admin is very useful for debugging your App Engine app.
I always find myself importing the same modules over and over again, particularly models.
I've looked into monkey patching the interactive console to automatically import these models, and I'm stumped. Ideally, I could do it from my app so I wouldn't need to reapply the patch every time I update the SDK.
I'll investigate and hopefully find an answer, please let me know if you have any ideas about how to accomplish this.
Good question! The relevant code for the interactive console is in InteractiveExecuteHandler at google/appengine/ext/admin/init.py:188. Specifically, it executes the code like this:
try:
compiled_code = compile(code, '<string>', 'exec')
exec(compiled_code, globals())
except Exception, e:
traceback.print_exc(file=results_io)
Note that for the globals, it simply uses the globals of the module it's in. So in order to provide your own imports, all you need to do is this:
Create your own module, where you import and subclass InteractivePageHandler and InteractiveExecuteHandler
Import any additional modules and classes you want in your new module - they'll automatically be imported for any code that's executed by them.
Override the generate() function from BaseRequestHandler in those classes so they look for the templates on google/appengine/ext/admin/templates instead of in the 'templates' subdir under your own module.
I ended up using the App Engine Console project which comes with an autoexec.py that provides the functionality I asked about.
I'm not sure if this is at all what you're going for, but you can just edit the html template for the interactive console page to have different default text entered. It's located at:
./google_appengine/google/appengine/ext/admin/templates/interactive.html
This would apply to all your apps, and as you mentioned you'd have to goof with it every time the SDK updated.

Resources