fix(guide): restructure curriculum guide articles (#36501)

* fix: restructure certifications guide articles
* fix: added 3 dashes line before prob expl
* fix: added 3 dashes line before hints
* fix: added 3 dashes line before solutions

guide/english/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md

@@ -1,12 +1,13 @@
 ---
 title: Write a React Component from Scratch
 ---
-## Write a React Component from Scratch
+# Write a React Component from Scratch
+
+---
+## Problem Explanation
 In this challenge we want to create a `class` react component (React components can be `class` components or `function` components). All of our class components are going to be an extention of `React.Component`. For example we can start to make a component called `FirstComponent` with:
 ```javascript
-class FirstComponent extends React.Component {
-
-};
+class FirstComponent extends React.Component {}
 ```
 We also need to be sure to define the `constructor` for our new class. It is best practice to call any component's `constructor` with `super` and to pass `props` to both. `super` pulls the `constructor` of our component's parent class (in this case `React.Component`). Now, the code for our component looks like this:
 ```javascript
@@ -14,11 +15,10 @@ class FirstComponent extends React.Component {
   constructor(props) {
     super(props);
   }
-  
-};
+}
 ```
 Now all that's left to do is define what our component will `render`! We do this by calling the component's `render` method, and returning our JSX code:
-```javascript
+```jsx
 class FirstComponent extends React.Component {
   constructor(props) {
     super(props);