Start Coding

Subjects

JAVASCRIPTHTMLCSSPYTHONSQLJAVACPPCSHARPPHPTYPESCRIPTCRUBYGOSWIFTKOTLINRUSTRBASHSCALAOBJECTIVE-CDARTPERLLUAMATLABXMLJSONMARKDOWNASSEMBLYLATEXYAMLSOLIDITYBLOCKCHAIN

Topics

TypeScript Basics

Introduction to TypeScriptTypeScript vs JavaScriptSetting up TypeScriptTypeScript Compiler (tsc)tsconfig.json ConfigurationTypeScript in Node.jsTypeScript in the Browser

TypeScript Types

Basic Types in TypeScriptType AnnotationsType InferenceUnion TypesIntersection TypesType AliasesLiteral TypesEnums in TypeScriptAny and Unknown TypesVoid, Null, and UndefinedNever TypeObject Types

TypeScript Variables and Functions

Variable DeclarationsConst AssertionsFunction TypesOptional and Default ParametersRest ParametersFunction OverloadingArrow Functions in TypeScript

TypeScript Interfaces

Interface BasicsOptional PropertiesReadonly PropertiesExtending InterfacesImplementing InterfacesHybrid TypesInterfaces vs Type Aliases

TypeScript Classes

Class BasicsInheritanceAccess ModifiersAbstract ClassesStatic MembersTypeScript ConstructorsGetters and SettersMethod Overriding

Advanced Types

Generics in TypeScriptGeneric ConstraintsConditional TypesMapped TypesIndex TypesTypeScript Utility TypesDiscriminated UnionsIntersection Types

TypeScript Modules

Module BasicsExport and ImportDefault ExportsRe-exportsDynamic ImportsAmbient Modules

TypeScript and OOP

Encapsulation in TypeScriptPolymorphism in TypeScriptTypeScript MixinsDecorators in TypeScript

TypeScript Error Handling

Try-Catch BlocksCustom Error TypesError Handling with Promises

TypeScript and Asynchronous

Promises in TypeScriptAsync/Await in TypeScriptTypeScript Generators

TypeScript Type Manipulation

Keyof OperatorTypeof OperatorIndexed Access TypesConditional TypesInfer KeywordTemplate Literal Types

TypeScript Best Practices

Strict ModeNull CheckingType Assertion Best PracticesTypeScript LintingTypeScript Style Guide

TypeScript and Libraries

Definitely TypedWriting Declaration FilesUsing Third-Party Libraries

TypeScript Tools and Ecosystem

TypeScript PlaygroundTypeScript with VS CodeTypeScript with WebpackTypeScript with ReactTypeScript with AngularTypeScript with Vue

Advanced TypeScript Concepts

TypeScript Compiler APIAbstract Syntax Tree (AST)TypeScript Language ServiceProject ReferencesTypeScript Performance Tuning

Re-exports in TypeScript

Re-exports are a powerful feature in TypeScript that allow you to export items from one module that were originally imported from another module. This concept is crucial for organizing large codebases and creating clean, modular structures.

Understanding Re-exports

Re-exports provide a way to create a single entry point for related functionality, simplifying imports for consumers of your code. They're particularly useful when you want to:

  • Consolidate multiple imports into a single module
  • Rename or alias imported items
  • Control which parts of a module are exposed to external code

Basic Syntax

The basic syntax for re-exporting in TypeScript uses the export keyword combined with from:

export { SomeItem } from './some-module';

Common Use Cases

1. Aggregating Exports

Re-exports are often used to create an index file that aggregates exports from multiple modules:

// index.ts
export { User } from './user';
export { Product } from './product';
export { Order } from './order';

This allows consumers to import multiple items from a single source:

import { User, Product, Order } from './models';

2. Renaming Exports

You can rename exports during re-export, which is useful for avoiding naming conflicts or providing more context:

export { User as CustomerUser } from './user';

Advanced Re-export Techniques

Exporting Everything

To re-export all items from a module, use the asterisk syntax:

export * from './module';

Combining Local and Re-exported Items

You can mix local exports with re-exports in the same file:

export { User } from './user';
export const API_VERSION = '1.0';

export function getApiUrl() {
    return 'https://api.example.com';
}

Best Practices

  • Use re-exports to create a clear public API for your modules
  • Avoid excessive nesting of re-exports to maintain code readability
  • Consider using tsconfig.json configuration to manage module resolution
  • Combine re-exports with export and import statements for flexible module management

Considerations

While re-exports are powerful, they can make it harder to trace the origin of imported items. Use them judiciously and maintain clear documentation to ensure your codebase remains maintainable.

Re-exports work seamlessly with TypeScript compiler (tsc), preserving type information and enabling robust type checking across module boundaries.

Conclusion

Re-exports in TypeScript offer a flexible way to structure your modules and control how your code is exposed to other parts of your application. By mastering this feature, you can create more organized and maintainable TypeScript projects.