How to store code in a javascript variable for prism

Question

I'm trying to display some code on my website. I'm using prism which is working well, however, I'm eventually going to have to store the code I'm trying to present in a mongodb database. Right now I'm having trouble figuring out how to save the code as variable codeSnippet and presenting it. How do I do this?

What it is suppose to look like

class DispalyCodeExample extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    Prism.highlightAll();
  }

  render() {
    return (
      <pre>
        <code className="language-javascript">
          {`
let animals = {
  cow: 'moo',
  mouse: 'squeak'
}
let mouse = 'cow';
let x = animals[mouse];
          `}
        </code>
      </pre>
    );
  }
}

My attempt that's not working - due to my codeSnippet variable

class DispalyCodeExample extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    Prism.highlightAll();
  }

  render() {
    const codeSnippet =  {
    let animals = {
      cow: 'moo',
      mouse: 'squeak'
    }
    let mouse = 'cow';
    let x = animals[mouse];
              };
    return (
      <pre>
        <code className="language-javascript">
         {codeSnippet}
        </code>
      </pre>
    );
  }
}

Rarblack · Accepted Answer · 2019-05-03 05:37:46Z

1

I would base64 encode the entire class, then store it in MongoDB. When you're ready to display on a web page, base64 decode the block of your source code. This way, all source code won't be changed to HTML characters. All variables and functions will be preserved.

edited May 3, 2019 at 5:37

Rarblack

4,6744 gold badges24 silver badges36 bronze badges

answered May 3, 2019 at 2:57

Biana- Custom Web Developer

263 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

bp123 Over a year ago

That seems to be a great solution, however, when used with prismjs the styling isn't being applied. It doesn't seem to recognise the opening {` and closing `} brackets. Any suggestions.

bp123 Over a year ago

all good figured out I can't save those brackets into my base64 code. Thanks again.

Collectives™ on Stack Overflow

How to store code in a javascript variable for prism

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related