Typescript
One coding language for any stack !!!
Agenda
✨ Demo
🚀 Typescript - Modern JS development
Stacks ⚡️ by Typescript
Fullstack Development 🎉
Hello👋
I'm Siva
Architect @ Computer Enterprises Inc
#Mobile #IoT #Cloud
Orlando
@ksivamuthu
🚀 Typescript
Modern JS Development
What's wrong with Javascript in the application that scales?
We know less about our data
const { title, members } = this.request.body
- What title means?
- What members means?
🤔
interface Team {
title: string;
members: Person[]
}
const team: Team = this.request.body;
console.log(team.title);
😊
Typescript Benefits
- Optional static typing
- Type Inference - Benefits of the types, without actually using them
- Access to ES6 & ES7 features
- Finally compiled down to Javascript.
- Great tooling support with Intellisense.
- Community - Microsoft Open source, Google
Stacks ⚡️ by Typescript
What exactly is the
full-stack development?
-
Frontend
-
Backend
-
Database
It's a decade ago..
Now..
-
Frontend
-
Backend
-
Database
-
Cloud Infrastructure
-
Design
-
Development Tools
Can JS/TS do
Full-stack development?
Yes.
Is JS/TS right fit for
Full-stack development?
Architectural
Trade-offs
Pros
- Common language, better team efficiency with fewer resources
- Extensive Code reuse
- High performance and speed
- Huge talent pool
- Extensive knowledge base
- Opensource toolset with community support
Cons
- Insufficiency with computation-heavy backend.
- Relatively young technologies/tools.
- Missing deep view on the particular stack.
- The bottleneck of tools in any stack
Server Side
nestjs
A progressive Node.js framework for building efficient, reliable and scalable server-side applications.
Reusability
uncoupled code blocks
Middlewares
Guards
Pipes
Interceptors
Filter Exception
@Controller()
@ApiUseTags('sessions')
@UseGuards(AuthGuard)
@UseInterceptors(LoggingInterceptor)
export class SessionController {
constructor(private readonly sessionService: SessionService) {}
@Get()
public async findAll() {
return this.sessionService.findAll();
}
@Get(':id')
public async findById(@Param('id', new ParseIntPipe())id: number) {
return this.sessionService.findById(id);
}
@Post()
@UseGuards(RoleGuard)
public async create(@Body() sessionDto: SessionDTO) {
return this.sessionService.create(sessionDto);
}
}Dependency Injection
Use guards / interceptors at this route
Use guards / interceptors at all routes
Pipes
Decorators
Integration
Websockets
Database
- Written in Typescript
- Influenced by Hibernate and Entity Framework
- Easy to learn
- Easy to maintain
- Typescript classes allow the extension for custom logic
- Well documented
- Built-in Cache (with a catch)
- Amazing knex like query builder
Why TypeORM?
Cloud Infrastructure
const appService = new azure.appservice.AppService(customImage, {
resourceGroupName: resourceGroup.name,
appServicePlanId: appServicePlan.id,
appSettings: {
WEBSITES_ENABLE_APP_SERVICE_STORAGE: "false",
DOCKER_REGISTRY_SERVER_URL: pulumi.interpolate`https://${registry.loginServer}`,
DOCKER_REGISTRY_SERVER_USERNAME: registry.adminUsername,
DOCKER_REGISTRY_SERVER_PASSWORD: registry.adminPassword,
// Our custom image exposes port 9000.
WEBSITES_PORT: "9000",
},
siteConfig: {
alwaysOn: true,
linuxFxVersion: pulumi.interpolate`DOCKER|${myImage.imageName}`,
},
httpsOnly: true,
});
export const appServiceEndpoint = pulumi.interpolate`https://${appService.defaultSiteHostname}`;
Extensible dev tools for Monorepos
Demo ✨
Reference
Thank you !!!
Typescript - Fullstack
By Sivamuthu Kumar
