reactjstypescriptsharepointframework

Base code/folder structure for SharePoint Framework SPFx using React

I am new for SharePoint SPFx and React. I am searching for best practice code structure for SharePoint SPFx development using React. Basically I am looking for the code structure where I can put components, models, services and html files in separate folders.

How to use HTML templates file from folder name templates into component file (.tsx)

enter image description here

Solution

  • I have created new folder name 'common-library' inside root folder 'src' and putting all common/shared code like base configurations, models, services in separate folder which can be used in any webpart and react component.

    Base code/folder structure enter image description here

    You can check complete code here.