Teams app development: react-northstar vs. react-teams

[jensker]

Hi guys,

I am working on my first teams app and now I am really confused.

The template generated by the official teams plugin from Microsoft, shows a sample that is build with components from react-northstar. As far as I understand, react-northstar is the official package for teams app development.

Yet, when I browse the microsoft documentation and look up the components that are displayed at figma (Microsoft Teams UI Kit), it shows components only available at react teams.

Can anyone enlighten me here? What is the official package to work with? Is it a good idea to mix the components from the two packages? What is a good practice when mixing the packages? For instance, react-teams components need the provider from react-teams and can not work with provider from react-northstar.

Thanks,
Jens

--

Some links for better understand:

React-Teams: https://www.npmjs.com/package/@fluentui/react-teams
React-Northstar: https://fluentsite.z22.web.core.windows.net/0.60.0/
Figma UI Kit: https://www.figma.com/community/file/916836509871353159