13

I'm looking for some guideline what's the difference between @fluent-ui/react and @fluent-ui/react-northstar. This documentation (READMEs) are super imprecise. I'm don't understand which one to use for what. I'm writing that react-component to be ran in webapp and the word plugin. Do you know which one to go for? They both look a bit different and feels that theming works a bit different.

speedingdeer
  • 1,236
  • 2
  • 16
  • 26

2 Answers2

5

You should use fluent-ui/react-northstar if you want to develop apps for Microsoft Teams, else you should use the normal fluent-ui.

AndreasLichtsinn
  • 66
  • 2
  • I'm not sure I understand this answer. What is Microsoft Teams exactly? If I'm making a standalone React app which one should I use? – darkadept Jul 30 '20 at 19:40
  • Fluent-ui/react-northstar is Microsoft's adaptation of their own Fluent UI, but with the Microsoft Teams styling. If you don't know what Microsoft Teams is, you should google it.Basically it's like Slack, but it allows to program some apps for it. If you are just programming in React, outside of SharePoint Framework and Teams you can use any framework you want. – AndreasLichtsinn Aug 01 '20 at 14:00
  • 1
    By "normal fluent-ui", you mean https://github.com/microsoft/fluentui? This is still super-confusing. – AleksG Sep 07 '20 at 19:22
  • 1
    yes, thats what I mean. It's not confusing, they're basically the same, northstar just has the purple MS Teams theme, that's all. – AndreasLichtsinn Sep 10 '20 at 20:21
  • 4
    I don't think they are that similar, the components for each differs significantly. I would like to know if the northstar library is the future for microsoft react? – Daniel Archer Nov 18 '20 at 21:47
2

If you look at a simple example of a dropdown, you will see that there is quite a lot of difference between the two. Northstar's dropdown combines the features of the dropdown with combobox.

northstar:

normal:

Another to take into consideration is that Northstar's scope is limited to Web / Desktop at present.

zcaudate
  • 13,998
  • 7
  • 64
  • 124
  • this is totally confusing. I am starting to use fluent ui for my react web application. I saw that react-card is deprecated. What should I use? What is the difference between the "React" and "Web components" mentioned in their documantation? I am creating a react web application which uses typescript. – Burre Ifort Jul 02 '22 at 06:52