book

Mastering TypeScript - Fourth Edition

by Nathan Rozentals

April 2021

Beginner

538 pages

12h 18m

English

Packt Publishing

Read now

Unlock full access

Who this book is forWhat this book coversTo get the most out of this bookGet in touch
A simple TypeScript IDEUsing npmHello TypeScriptTemplate strings and JavaScript versionsTypeScript project configurationWatching files for changesTypeScript basicsStrong typingBasic typesInferred typingDuck typingFunction signatures and voidVS Code IntelliSenseVS Code debuggingIntroducing third-party librariesDeclaration filesSummary
any, let, unions, and enumsThe any typeExplicit castingThe let keywordConst valuesUnion typesType guardsType aliasesEnumsString enumsConst enumsMore primitive typesUndefinedNullConditional expressionsOptional chainingNullish coalescingNull or undefined operandsDefinite assignmentObjectUnknownNeverNever and switchObject spreadSpread precedenceSpread with arraysTuplesTuple destructuringOptional tuple elementsTuples and spread syntaxObject destructuringFunctionsOptional parametersDefault parametersRest parametersFunction callbacksFunction signatures as parametersFunction overridesLiteralsSummary
InterfacesOptional propertiesInterfaces are compiled awayInterface namingWeak typesThe in operatorkeyofClassesThe this keywordImplementing interfacesClass constructorsClass modifiersJavaScript private fieldsConstructor parameter propertiesReadonlyGet and setStatic functionsStatic propertiesNamespacesInheritanceInterface inheritanceClass inheritanceThe super functionFunction overridingProtectedAbstract classesAbstract class methodsinstanceofInterfaces extending classesModulesExporting modulesImporting modulesModule renamingMultiple exportsModule namespacesDefault exportsSummary
GenericsGeneric syntaxMultiple generic typesConstraining the type of TUsing the type TGeneric constraintsGeneric interfacesCreating new objects within genericsAdvanced type inferenceMapped typesPartial, Readonly, Record, and PickConditional typesConditional type chainingDistributed conditional typesConditional type inferenceType inference from function signaturesType inference from arraysStandard conditional typesSummary
CallbacksPromisesPromise syntaxPromise errorsReturning values from PromisesPromise return typesAsync and awaitAwait syntaxAwait errorsAwait valuesCallbacks versus Promises versus asyncSummary
Decorator overviewDecorator setupDecorator syntaxMultiple decoratorsTypes of decoratorsDecorator factoriesExploring decoratorsClass decoratorsProperty decoratorsStatic property decoratorsMethod decoratorsUsing method decoratorsParameter decoratorsDecorator metadataUsing decorator metadataSummary
Declaration filesGlobal variablesJavaScript code in HTMLFinding declaration filesWriting declaration filesThe module keywordDeclaration file typingFunction overloadingNested namespacesClassesStatic properties and functionsAbstract classesGenericsConditional typesConditional type inferenceDeclaration file summaryIntegration compiler optionsThe allowJs and outDir optionsCompiling JavaScriptThe declaration optionSummary
Nested configurationStrict OptionsstrictNullChecksstrictPropertyInitializationstrictBindCallApplystrictFunctionTypesno compiler optionsnoImplicitAnynoUnusedLocals and noUnusedParametersnoImplicitReturnsnoFallthroughCasesInSwitchnoImplicitThisSummary
Introduction to Observablespipe and mapCombining operatorsAvoid swallowing valuesTime-based ObservablesObservable errorscatchErrorObservables returning ObservablesmergeMapconcatMapforkJoinObservable SubjectSummary

The testing paradigmUnit, integration, and acceptance testsUnit testsIntegration testsAcceptance testsUnit testing frameworksJestts-jestWatch modeGrouping testsForcing and skipping testsMatchersTest setup and teardownData-driven testsJest mocksJest spiesSpies returning valuesAsynchronous testsUsing doneUsing async awaitHTML-based testsDOM eventsProtractorSeleniumFinding page elementsSummary
Angular setupApplication structureAngular modulesAngular MaterialA shared moduleAn Angular applicationAngular DOM eventsAngular EventEmitterAngular servicesAngular Dependency InjectionChild componentsAngular formsReactive formsReactive form templatesReading form valuesAngular unit testingUnit testing formsReacting to domain eventsSummary
Introduction to ReactReact setupJSXJSX and logicReact propsReact event handlingReact stateA React applicationApplication overviewMechanical keyboard switchesApplication componentsThe CollectionView componentThe ItemView componentThe DetailView componentThe App componentReact formsSummary
Introduction to VueVue setupComponent structureChild components and propsComponent stateComponent eventsComputed props, conditionals, and loopsA Vue applicationApplication overviewMaterial Design for BootstrapApp componentShoppingCart componentItemView componentCheckoutView componentItemTotalView componentSummary
Express introductionExpress setupExpress routerExpress configurationAn Express applicationExpress templatingHandlebars configurationUsing templatesStatic filesExpress formsExpress session data and redirectsSummary
Serverless setupAWS Lambda architectureInstalling the SAM CLIInitializing a SAM applicationGenerated structureDeploying a SAM applicationBuilding an APIDynamoDB tablesNoSQL WorkbenchApplication API endpointsA Lambda functionCompiling LambdasRunning Lambdas locallyLambda path parametersProcessing database recordsAPI summarySummary
Design conceptsMicro front-end mechanismsThe iframe techniqueThe JavaScript techniqueThe Registry techniqueWhat we will useCommunication mechanismsDomain eventsThe Event BusBuilding a micro front-end applicationThe global Event BusBuilding a moduleModule typingReact updatesLoading data from an APIReact domain eventsVue updatesVue domain eventsFetching data in VueRaising EventsAngular micro front-endMicro front-end DOM ContainersRendering the React front-endRendering the Vue front-endAngular domain eventsOur micro front-end applicationThoughts on micro front-endsSummary

Content preview from Mastering TypeScript - Fourth Edition

12 React

React is a JavaScript framework originally developed by Facebook, and is widely used and very popular within the JavaScript community. React uses a specific inline syntax for combining HTML templates and JavaScript code in the same file, which is named JSX, or JavaScript XML. Interestingly, React is only geared toward rendering components to the DOM, and does not provide an out-of-the-box framework for things like routing. For this reason, React is often combined with other frameworks, such as Redux for state management, or React Router for routing capabilities. That said, React is an extremely efficient rendering engine, and is generally a lot faster than other frameworks in terms of rendering speed. There are some, but not many, frameworks ...