How to make a collapsible code block within a markdown file on GitHub.

#Markdown_collapsible _codeblock.md

#Markdown_collapsible _codeblock.md

Overview

• Document demonstrates how to use GitHub's markdown syntax to make a collapsible codeblock.

Usage

* Concept 1
* Concept 2
  <details><summary>Code Example</summary><p>
    
    ```JSX
      const someComponent = (props) => {
        const [newAttribute, setAttr] = useState(props.attr);
        const clickHandler = () => { setAttr('This is the new value.'); };
        return (
         <div>
           {props.attr}
           <button onClick={clickHandler}>Change Attribute</button>
         </div>
        );
      }
    ```
  </p></details>

Output

• Concept 1

• Concept 2

  Code Example

    const someComponent = (props) => {
      const [newAttribute, setAttr] = useState(props.attr);
      const clickHandler = () => { setAttr('This is the new value.'); };
      return (
       <div>
         {props.attr}
         <button onClick={clickHandler}>Change Attribute</button>
       </div>
      );
    }