Skip to content

Instantly share code, notes, and snippets.

View AnishDe12020's full-sized avatar
🚀
Buidling

Anish De AnishDe12020

🚀
Buidling
View GitHub Profile
did:3:kjzl6cwe1jw146k8pf0u0fyta04gcqv4vglp6bpxcse5xxprs7qvg736e1928kd
@AnishDe12020
AnishDe12020 / cli.js
Created September 23, 2021 15:46
Medium - Getting Started with React Ink
#!/usr/bin/env node
'use strict';
const React = require('react');
const importJsx = require('import-jsx');
const {render} = require('ink');
const meow = require('meow');
const ui = importJsx('./ui');
const cli = meow(`
Usage
$ sandbox
import { serialize } from "next-mdx-remote/serialize";
import { MDXRemote } from "next-mdx-remote";
import CustomMDXCode from "../components/CustomMDXCode";
export default function Home({ source }) {
return (
<div>
<MDXRemote
components={{ code: props => <CustomMDXCode {...props} /> }}
{...source}
import { Sandpack } from "@codesandbox/sandpack-react";
import "@codesandbox/sandpack-react/dist/index.css";
const CustomMDXCode = props => {
return (
<Sandpack
template={props.template}
files={{ [`/${props.filename}`]: props.children }}
/>
);
import { serialize } from "next-mdx-remote/serialize";
import { MDXRemote } from "next-mdx-remote";
export default function Home({ source }) {
return (
<div>
<MDXRemote {...source} />
</div>
);
}
export default function Home() {
return <div></div>;
}
import { Sandpack } from "@codesandbox/sandpack-react";
import "@codesandbox/sandpack-react/dist/index.css";
function App() {
return (
<div>
<Sandpack template="react" theme="sandpack-dark" />
</div>
);
}
<Sandpack template="react" theme="sandpack-dark" />
<Sandpack template="react" />
<Sandpack />