Added content for component lifecycle method in component-lifecycle.mdx #23
Conversation
|
Hey @TechGeekRahul did you go through the website for all the required things such as naming conventions etc? Unless those things are followed PR won't be merged, Please follow naming conventions and other contribution guidelines. |
|
yes I have went through the website and followed each of the given steps and contribution guidelines. |
|
@TechGeekRahul Did you even run the project locally? I think you didn't. I can see the basic mistakes in your file; it is because there is an error. Please take time to go through the code base and do your research regarding the usage of Please note that everything will be reviewed. |
Did you go through the naming conventions? Please check the name of your pull request it is not as per the guidelines. |
|
|
||
| Example of using useEffect: | ||
|
|
||
| import { useEffect } from 'react'; |
There was a problem hiding this comment.
Use astro star light components
|
|
||
| To prevent memory leaks and ensure proper resource management, it’s essential to implement cleanup functions within useEffect. The cleanup function runs before the component unmounts or before the effect runs again if dependencies change. | ||
| Example of implementing cleanup: | ||
| javascript |
There was a problem hiding this comment.
please provide proper formatting. Also, note that since this doesn't include high-level code contribution we expect great content that can help all levels of developers. Therefore enhance your content with better explanation and code snippets.
| The unmounting phase occurs when a component is being removed from the DOM. The relevant lifecycle method here is: | ||
| componentWillUnmount: This method is called just before a component is unmounted and destroyed. It’s typically used for cleanup tasks such as invalidating timers or canceling network requests. For example: | ||
|
|
||
| componentWillUnmount() { |
There was a problem hiding this comment.
Be more specific regarding these. Include usage code of the components as well.
|
okay I will do that thanks for highlighting. |
rakshixh
added
status: waiting update
| javascript | ||
| useEffect(() => { | ||
| const timer = setTimeout(() => { | ||
| console.log('Timer executed'); |
There was a problem hiding this comment.
Please use the src\content\docs\react\codes\componentLifecycleCode folder to dump all code-related files. Please use mdx not just md. Use Astro Star Light components such as tab, code etc to present the content visually.
|
Hey @TechGeekRahul , |
rakshixh
added
inactive
📑 Description
[docs](React Component lifecycle): This PR adds a new section under the React documentation covering Component Lifecycle methods. It explains the lifecycle methods in class components (componentDidMount, componentDidUpdate, and componentWillUnmount) and provides a detailed comparison with functional components using the useEffect hook. The content includes code examples, best practices, and guidelines for handling side effects and cleanups in both class-based and functional components.
✅ Checklist
🔗 Related Issue(s)
Closes #19
🚀 Types of changes
<! [x] Documentation update (docs for this project)