I'd like to define my JSX code as a string, so that I can save it to a database, then load it and build the page with this code.
Can you recommend me a way to do this?
I don't want to use dangerouslysetinnerhtml, because it doesn't behave as a "real jsx components". Thank you.
Since I see some people are still having this problem, I'm answering my question after three years - use https://mdxjs.com/ . It works both during the build and/or runtime.
Related
Almost all the references online mention the use of MDX with React.js. Even though other frameworks or libraries support MDX (with help of components), I haven't specifically seen the use of ".mdx" file formats outside of React.
The support of ".mdx" files in Gatsby and Next.js allows us to create a separate folder for the blog posts and have them stored anywhere (CMS, Github etc...) which helps in organizing. And the file extension of ".mdx" itself is pretty straight-forward and self-explanatory even for a beginner to grasp the concept.
So I was just wondering - If I would like to use mdx files, am I limited to React.js? Is it possible to use Svelte, Vue, Angular as well?
Yes you can use mdx outside of React but not everywhere, Check out this guides I hope they help!
mdx for Vue.js: https://mdxjs.com/guides/vue/
mdx for Svelte(MDsveX): https://madewithsvelte.com/mdsvex
MDX as such is specifically for React because it uses JSX to define it's component.
I am sure there are alternatives for other frameworks, as a Svelte user myself I know that at least Svelte has MDSVEX which is basically the same.
Hello and thanks for your time!
So since there're a couple of similiar questions out there, I'll make this quick:
I've got some LOCAL images/photos loaded dynamically from an object, something "require" won't let me do.
I've already tried what's been discussed on github way back in 2015, doesn't seem to do the trick for me.
Is it really (still?) considered best practice to import these images/photos as an encoded string via JSON as already suggested HERE ?
...or am I missing something?
(Look, I'm really sorry for reopening this discussion once again, but maybe someone could mark this as a "Best-Practice for utilizing local images in a non-static way") - it would then also be very helpful for other programmers who haven't really wrapped their head around React (Native) that much yet.)
Thanks for your input!
Given there is a React project that uses plain javascript, is there a way to use typescript partially only to define models?
So, lets say there are a few models that map to server responses, can only those be defined in typescript while the rest of the project remains in javascript.
If its possible, how to do it?
Typescript can definitely be implemented gradually into an existing JS project, and I know a few people who have gone through the process on some monoliths, it can be a really boring process but usually low risk.
I'll link you straight away to this:
https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html
The key is to understand what your goal is, and how to set everything up properly to accommodate for it, as you go it's as simple as toggling a few settings to unblock/check work as you go.
As for your question about some files being JS and some being TS, typescript handles pure JS perfectly fine, so you can switch every file to TS and even if it's pure js there won't be an issue :)
Have a read and if you need any more help on some specifics feel free to comment
What is the best solution for including vanilla JS libraries in TypeScript projects? This is one of those things that "works" just fine, but I feel like I'm clearly not going about this in a "best-practices" sort of way.
Let's say, for example, that you want to use EaselJS in an Angular project. You can just add a link to CreateJS in your index.html file as usual, and then you have access to the global createjs object, but your compiler will of course know nothing about createjs, and will assume that you've got an error. What's the best way to let TypeScript know about this external source?
Moreso, what's the best way to enable auto-completion so that when I type "createjs." I get a list of the methods in that file? Is mixing JS and TS like this possible?
I suppose I could create a TypeScript shim that passes things through to the createjs object, but then that shim would be riddled with "errors."
Thoughts?
Thanks!
Oh, looks like this is done via a definition (.d.ts) file. There's a good tutorial here. In fact, CreateJS already has one of these available here, and if you go up a level in that Github Repo you'll find tons of these definition files in the DefinitelyTyped repository. I haven't tried this out yet, but it looks like the right direction.
You should use ambient declaration.
declare var createjs;
You use ambient declarations to tell the TypeScript compiler that some other component will supply a variable.
In my search for a good social login package for App Engine, I am giving gae-boilerplate a try. But I find there is no documentation except the readme file, which I think it is not enough at all.
I have many questions, among them:
Should the boilerplate be used as a library or download and modify as needed?
How should the boilerplate be updated?
What does each model do?
Where should my templates go?
Should I have a different routes file?
Should I derive my Handlers from BaseHandler?
In general, what things should I implement in my pages? For example, I found out that I have to include a csrf_token in all POST requests. It would have been nice to know this in advance, and the many other things that I'm having to find out along the way, and which I implement without being sure if I'm supposed to be doing that.
And some more...
My biggest problem is that Social login is not working, and I feel this boilerplate is a big monster with which I don't know where to start. To make things worse, it is hard to debug social auth from any machine that is not the production one. Thats why I'm desperately looking for some docs.
I have not found anything in SO, and I guess there must be more people in my situation. So, any pointers to documentation that could help to understand gae-boilerplate a little bit better would be very appreciated.
EDIT: I switched to gae-boilerplate in a site that I had previously working. Maybe most of my problems come from the way that I have tried to integrate gae-boilerplate and my existing site. As a result I have tried to treat gae-boilerplate as a library, and keep my own templates, handlers, static files and such.
Thank you guys!
EDIT 2: After trying other options, I have to say that I am very happy with gae-simpleauth. It works really well, and Alex's support is superb.
I will try to answer most of your questions below:
Should the boilerplate be used as a library or download and modify as needed?
You can modify it as needed based on your specific requirements.
How should the boilerplate be updated?
What do you mean?
What does each model do?
User and SocialUser are pretty self explanatory. LogVisit and LogEmail are used for auditing purposes.
Where should my templates go?
In the templates directory
Should I have a different routes file?
No, you can use the existing file for all your routes.
Should I derive my Handlers from BaseHandler?
It't not mandatory but I would recommend to do so. BaseHandler is very handy and provides a lot of good stuff.
In general, what things should I implement in my pages?
What exactly do you mean?
In general, you can use gae-boilerplate as a reference on top of which you will built your own project. Study the code step by step, try to figure out what is the purpose of each file and library used and how they work together. This way you will gain good knowledge of a lot of things like jinja templating, oauth2, etc.
Hope this helps.