React-Js Development For Steemit | Component Reusability | Steem Alliance Community.

Hello Everyone,

How are you guys, I hope members of Steem alliance will be well and good, by the grace of God, I am also feeling well. My responsibility in this community is as a development manager. I have started the consistently tutorial base program to spread the knowledge of programming and development.

In this tutorial, I have selected the topic “Component Reusability”. after the successful completion of react I will design a front end of steemit with extra features by using SDS API and steem js library.

Components Reusability

Importing and Exporting the react components the core part of react js development. Through this way we can organize our react components into separate files and import them into different files once we needed. Where our component exist, we use the export default keyword to export component. There are two ways to export components. how to import and export components in React

The default export is used when we are exporting a single component from a file. Exporting component with curly brace is useful when we want to export multiple components from a single file.

Syntax

// Default export
export default Component_Name;

// Named export
export { MyComponent };

Where you want to use an import the component, you want to import using the import keyword. There are two steps to importing components. We can use both methods, one is curly braces method and second one is 'Import' keyword.

// Default import
import MyComponent from './MyComponent';


// Named import
import { MyComponent } from './MyComponent';

Default import keyword will used when we are importing a component that is exported from other file by usinf export default keyword. Importing by curly braces will use when we have export the target component from other file by using its name & curly braces.

Methods	Export Statement	Import Statement
Default keyword	export default function Steemit() { }	Import Steemit from './new'
Named & Curly braces	export function Steemit() { }	Import { Steemit } from './new'

In the above screenshots, you can see the two files. one is index.js that is root file and second one is new.js file. i am exporting the components from new.js file and importing it in the root file that is index.js. I hope this post will be helpful for those users who have interest in development. for any discussion, please contact me on discord or in the comment section below.

Please cast witness vote to @bangla.Witness or set proxy to @rme.

_
Vote @bangla.witness as witness
Set Proxy @rme as proxy

Special Thanks.

Cc: @rme
Cc: @hungry-griffin
Cc: @stephenkendal

Thanks for giving your precious time to my post.
Follow | Upvote | Share | Comments
Follow me on Instagram.
Instagram

🆃🅷🅰️🅽🅺 🆈🅾️🆄