Typescript Support #32

giovannidegani · 2018-10-27T22:59:32Z

Any plans to use typescript or support it with typings ?

droshev · 2018-11-09T15:40:14Z

@tiefox could you share your thoughts about using TS in React projects?

o0Djeen0o · 2018-11-13T08:58:12Z

@droshev quick thoughts:

From this repository benefits:

static typechecks !
ease of code maintenance, especially with growing codebase
saving developer time (after initial startup which is for sure more complex, but really well covered today) code completion, intellisense...
react support is really good with typescript

For consumers:

Sharing your component APIs with d.ts files

I don't want to make a real advert or develop arguments, I think that many good writers have done it already :-)

giovannidegani · 2018-11-14T10:39:11Z

Sorry for late reply, but my thoughts are exactly the same as @o0Djeen0o . In my company we are looking to standardize all front-end development on Typescript, and currently looking to base our own internal component library for our internal enterprise apps on a good foundation, and we do already some Fiori + UI5, but also want to provide a standard to other teams working with React and Angular. Would be awesome if it was already in Typescript :)

droshev · 2018-11-19T16:34:03Z

@o0Djeen0o @tiefox thanks for your feedback. I have asked few colleagues writing in React such as @casche to share some ideas. They use https://flow.org/. What are your thoughts for TS vs. Flow?

giovannidegani · 2018-11-20T07:33:39Z

For me is mostly the traction that TS is getting vs Flow, the ecosystem is booming and we are making a bet on it. See this https://2018.stateofjs.com/javascript-flavors/conclusion/

droshev · 2018-11-20T14:45:11Z

@tiefox I have seen that link. Both of them are close in terms of dev's satisfaction. I know that TS is more popular this year. This may flip quite fast.
Can we try to evaluate both and make a decision? What do you think if we (me, @InnaAtanasova, and @chrismanciero) we use Flow for a component and you use TS for the same component?
What do you think? If you agree which component would you propose?

o0Djeen0o · 2018-11-20T16:05:57Z

Hi again @droshev,

I think that both solutions are valid for static type checking. As @tiefox mentionned, typescript has better support from the open source community, but Flow is also used and has Facebook behind, so both solutions valid here.

The real difference is that Typescript is not just about static typings. It can work like that (you have for instance a babel preset to just remove typings info, like for Flow), but it is more a language with:

A compiler for your code, choosing which type of ES output you would like to address
Since 3.0, it has project reference, helping to work with mono repos for instance, which is really useful for project with many components, like UI frameworks

I'll let you check what fits your needs best.

droshev · 2018-11-20T16:16:31Z

@o0Djeen0o @tiefox ok, we will discuss it and keep you posted

giovannidegani · 2018-11-21T07:35:24Z

@droshev Sure! Lets figure out the right component and do this :)

chrismanciero · 2018-12-05T21:03:58Z

Since the question is still out there as to how/if we should use TypeScript or Flow for our components,
I took the task of seeing what would be involved with converting a component into TypeScript. There was no definitive reason why I choose TypeScript over Flow, I just wanted to learn TypeScript 😄 .

For my learning process, I decided to convert the SearchInput control. I create a separate create-react-app project with typescript enabled and it took about less than an hour to get the SearchInput control working exactly like it does in the current version. I did spend more time familiarizing myself with Typescript syntax since I haven't used it in a while than I did actually convert the JS to TSX.

Because that conversion was so fast I also did the MultiInput, Modal and Pagination components as well. I would have to say in total time worked, it probably took less than 2 hours to convert all 4 components to TypeScript.

giovannidegani · 2018-12-07T11:47:22Z

Great @chrismanciero . I didn't had time yet to look into this ( just a lousy architect with barely any time to code anymore ) but I will also try a few.

alexanderchan · 2018-12-12T22:59:05Z

I don't want to start a typescript vs flow debate but with Microsoft behind TypeScript it's been great with tooling and also the fact that the angular fundamentals codebase will also be leaning towards typescript -- I think the answer is pretty straightforward about which to choose for consistency.

chrismanciero · 2018-12-13T01:01:04Z

I created this branch that has about 18 of 31 components rewritten using TypeScript - https://github.com/SAP/fundamental-react/tree/typescript-conversion

Maybe that will push the conversation further as to what solution to use and if we go with TypeScript the ground work is setup to go foward with it.

CodesOfRa · 2018-12-13T14:04:28Z

alexanderchan · 2018-12-13T16:17:51Z

@chrismanciero and @CodesOfRa these look great! I think one thing you may want to do is export the interface of the props and anything else passed in so that devs can import those props and use them as well. palantir/blueprint has a good example of this where they export IButtonProps

alexanderchan · 2019-01-15T05:36:39Z

Looks like things are still moving towards typescript, just in case we need any more reason, Kent C Dodds has a good post on Why every new web app at PayPal starts with TypeScript coming from having him used Flow prior to TypeScript.

giovannidegani · 2019-01-15T13:58:19Z

Looks like things are still moving towards typescript, just in case we need any more reason, Kent C Dodds has a good post on Why every new web app at PayPal starts with TypeScript coming from having him used Flow prior to TypeScript.

Another interesting one:
https://davidgom.es/porting-30k-lines-of-code-from-flow-to-typescript/

mobot11 · 2019-01-16T00:55:14Z

I really like this tweet from Dan Abramov concerning when to implement a type system. https://twitter.com/dan_abramov/status/1084850819965554688. I'd say currently most of our 'bugs' are related to infrastructure and missing features. Once the library matures a bit more I'd be more inclined to consider adding a type system.

giovannidegani · 2019-01-16T06:16:01Z

Another one bites the dust...
jestjs/jest#7554

lmcarreiro · 2019-02-01T18:32:13Z

After using TypeScript for some time in a React+Redux+Material-UI project, I can't live without it anymore.
It's like abandoning the syntax highlighting and start using the windows's notepad.exe.
I'll start to use Fundamental the day it start supporting TypeScript.

Feinbube · 2019-05-02T09:02:38Z

enjoy: https://www.npmjs.com/package/@types/fundamental-react :D

tnurmi82 · 2019-11-21T21:47:37Z

enjoy: https://www.npmjs.com/package/@types/fundamental-react :D

Cannot thank you enough for this! thumbs up

YuJianrong · 2019-12-10T16:36:35Z

enjoy: https://www.npmjs.com/package/@types/fundamental-react :D

So nice! Is there any plan to merge these kind of typing into product and add do Typescript support officially?

I cannot imaging living without Typescript now and my Library choice priority is:

Written in Typescript
Written in Javascript, .d.ts maintained by the official team.
Written in Javascript, @types maintained by 3-rd party developers.
Written in Javascript and no typing at all.

tnurmi82 · 2019-12-11T08:28:59Z

I cannot imaging living without Typescript

Could not agree more. I'm maintaining a bunch of older Javascript apps, and only recently started in a new Typescript project. It took about 3 seconds of using TS+VSCode to convince me there is no going back...

skvale · 2019-12-13T22:35:15Z

As a start, I started working on updating the DefinitelyTyped types here: DefinitelyTyped/DefinitelyTyped#41027

zanonnicola · 2020-03-11T13:26:34Z

I just tried today to pull the types for this library but it seems there's a miss-match between some components.

Fo example the Select component seems to be called FormSelect.

From the docs:

<Select placeholder="Select">
    <List>
      <List.Item>
        <List.Text>
...

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/fundamental-react/lib/Forms/FormSelect.d.ts

Would be great to merge types definition into the project!

skvale · 2020-03-11T17:11:56Z

Drafting an update to the DefinitelyTyped types DefinitelyTyped/DefinitelyTyped#43067

This has been merged as @types/fundamental-react@0.8.1

maylukas mentioned this issue Dec 12, 2018

feat: extend functionality of the tabs component #99

Closed

CodesOfRa added the discussion label Dec 12, 2018

jbadan closed this as completed Apr 22, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Typescript Support #32

Typescript Support #32

giovannidegani commented Oct 27, 2018

droshev commented Nov 9, 2018

o0Djeen0o commented Nov 13, 2018

giovannidegani commented Nov 14, 2018

droshev commented Nov 19, 2018 •

edited

giovannidegani commented Nov 20, 2018

droshev commented Nov 20, 2018

o0Djeen0o commented Nov 20, 2018

droshev commented Nov 20, 2018

giovannidegani commented Nov 21, 2018

chrismanciero commented Dec 5, 2018

giovannidegani commented Dec 7, 2018

alexanderchan commented Dec 12, 2018

chrismanciero commented Dec 13, 2018

CodesOfRa commented Dec 13, 2018 •

edited by chrismanciero

alexanderchan commented Dec 13, 2018

alexanderchan commented Jan 15, 2019

giovannidegani commented Jan 15, 2019 •

edited

mobot11 commented Jan 16, 2019 •

edited

giovannidegani commented Jan 16, 2019

lmcarreiro commented Feb 1, 2019 •

edited

Feinbube commented May 2, 2019 •

edited

tnurmi82 commented Nov 21, 2019

YuJianrong commented Dec 10, 2019

tnurmi82 commented Dec 11, 2019

skvale commented Dec 13, 2019

zanonnicola commented Mar 11, 2020

skvale commented Mar 11, 2020 •

edited

Typescript Support #32

Typescript Support #32

Comments

giovannidegani commented Oct 27, 2018

droshev commented Nov 9, 2018

o0Djeen0o commented Nov 13, 2018

giovannidegani commented Nov 14, 2018

droshev commented Nov 19, 2018 • edited

giovannidegani commented Nov 20, 2018

droshev commented Nov 20, 2018

o0Djeen0o commented Nov 20, 2018

droshev commented Nov 20, 2018

giovannidegani commented Nov 21, 2018

chrismanciero commented Dec 5, 2018

giovannidegani commented Dec 7, 2018

alexanderchan commented Dec 12, 2018

chrismanciero commented Dec 13, 2018

CodesOfRa commented Dec 13, 2018 • edited by chrismanciero

alexanderchan commented Dec 13, 2018

alexanderchan commented Jan 15, 2019

giovannidegani commented Jan 15, 2019 • edited

mobot11 commented Jan 16, 2019 • edited

giovannidegani commented Jan 16, 2019

lmcarreiro commented Feb 1, 2019 • edited

Feinbube commented May 2, 2019 • edited

tnurmi82 commented Nov 21, 2019

YuJianrong commented Dec 10, 2019

tnurmi82 commented Dec 11, 2019

skvale commented Dec 13, 2019

zanonnicola commented Mar 11, 2020

skvale commented Mar 11, 2020 • edited

droshev commented Nov 19, 2018 •

edited

CodesOfRa commented Dec 13, 2018 •

edited by chrismanciero

giovannidegani commented Jan 15, 2019 •

edited

mobot11 commented Jan 16, 2019 •

edited

lmcarreiro commented Feb 1, 2019 •

edited

Feinbube commented May 2, 2019 •

edited

skvale commented Mar 11, 2020 •

edited