Pull to refresh
65.41
Rating

TypeScript *

A strict syntactical superset of JavaScript

Show first
  • New
  • Top
Rating limit
  • All
  • ≥0
  • ≥10
  • ≥25
  • ≥50
  • ≥100

Improving the quality and formatting of the code in the TypeScript

JavaScript *Node.JS *Start-up development TypeScript *
Sandbox

With the help of the ESLint and Prettier features, you can automate the formatting of your code, make it more expressive and accurate, correspond to specific rules, and avoid errors and bottlenecks even before uploading the code to the shared source storage...

Read more
Total votes 1: ↑0 and ↓1 -1
Views 715
Comments 2

Creating Node.JS web server application with Express, Typescript, Jest, Swagger, log4js and routing-controllers

Node.JS *TypeScript *
Translation
This is a step by step instruction for creating Node.JS web server application with typescript and express. Creating of new web application on Node.JS is is not making often, so the steps how to do it can be forgotten. So this article is a kind of reminder for me and other developers. Also I added in article links to video clips for more clarification. Here I show how to create application on Node.JS without using any frameworks for it. Just Node.JS and packages.
Read more →
Total votes 1: ↑0 and ↓1 -1
Views 1.4K
Comments 1

Ant Design Component Customization and Bundle Optimization

Mail.ru Group corporate blog JavaScript *TypeScript *

I'm Ivan Kopenkov, a senior front-end developer at Mail.ru Cloud Solutions. In this article, I will tell you about the approaches we have used for the UI library components customization. You will also learn how to significantly decrease bundle size, cutting off all the unnecessary modules Ant Design takes there.

In our case, we are making wrappers for original Ant Design components inside the project, changing their appearance, and developing their logic. At the same time, we import both customized and original components right from the ant-design module. That saves tree shaking functionality and makes complex library components use our wrappers instead of original nested elements.

If you are already or about to use Ant Design, this article will provide you with a better and more effective way to do so. Even if you have chosen another UI library, you might be able to implement these ideas.

Read more
Total votes 12: ↑12 and ↓0 +12
Views 1.7K
Comments 0

Plugins in Figma. From idea to 1000 installs

TypeScript *Design
About a year ago, Figma added the ability to develop and publish your own plugins. Those who would like to please themselves and everyone around them with additional features or just to have the experience of lifetime with Figma have longed for this feature to appear. 

Inside the plugin, you can do whatever is available to the developer on the web. There are practically no restrictions on the possibilities, except for those related to the system. Fortunately, they are all detailed in the documentation. Many detailed articles have already been written on the topic of technical implementation of plugins, for example, here or here. As product designers, Lev Bruk and I wanted to go through all the stages of plugin release, from the idea and coding to promoting and working with feedback from real users. That’s exactly what we’re going to cover in the article.

image
Read more →
Total votes 3: ↑3 and ↓0 +3
Views 1.6K
Comments 1

How to display a gazillion of metrics and keep your sanity

JavaScript *Data visualization TypeScript *


I now have a new shiny blog. Read this article with the latest updates there https://blog.goncharov.page/how-to-display-a-gazillion-of-metrics-and-keep-your-sanity

Large scale equals distributed. Distributed equals inevitable complexity. Complexity at runtime equals extensive monitoring. At Hazelcast, doing distributed systems well is our bread and butter. It means we have no choice but to be huge fans of collecting all kinds of metrics to stay on guard of the data our users trust us with.


In Management Center 4.2020.08, we drastically changed the model of how we transfer the metric data from the cluster members to the Management Center, how we store it, and how we display it. In this post, we are going to talk about the latter bit of the triad.


We will discuss what to do when you want to display all the data at once, but your users have a limited number of monitors and only one pair of eyes. We will speculate about what users actually want to see when they look at a chart of a monitoring web app. We will go over different approaches to filter the data, and how an average, a median, and a definite integral play their key roles.


Cross-posted from hazelcast.com

Read more →
Rating 0
Views 395
Comments 0

Prettier is a Must-Have for Large-Scale Projects: Spent 20 Minutes Setting It Up and Forgot About Formatting for a Year

Skyeng corporate blog Website development *JavaScript *Angular *TypeScript *
Many dev teams get split over formatting. And their typical day looks like this: you come to work, have some coffee, write some code, everything’s fine — then bam! Code review where you’re told you put a brace in the wrong place.

image

It was an everyday reality for one of Skyeng dev teams a year ago. Then someone had enough and said, “Guys, from now on we use Prettier. Is everyone ok with that?” And then there were no more debates about formatting. We’ve installed Prettier in the frontend repo and all the teams use it.
Read more →
Total votes 10: ↑9 and ↓1 +8
Views 3.3K
Comments 0

Modern Environment for React Native Applications

Programming *Development for iOS *Development for Android *ReactJS *TypeScript *
Sandbox
In this article, we will consider the process of setting up a React Native environment using expo-cli, Typescript, and Jest.
Typescript will help us avoid development mistakes and write a more efficient mobile application.

Modern tools allow integrating Typescript into the development environment. We can also use VS Code that supports Typescript.

Integration with React Native will give us the opportunity to use the auto-completion service, code navigation, and refactoring.

Expo is a toolkit that simplifies the creation of native React applications. This tutorial will give you an idea of how you can quickly create native React applications using Expo.


Read more →
Total votes 7: ↑6 and ↓1 +5
Views 1.4K
Comments 0

Web Worker easier than you thought

Waves corporate blog JavaScript *TypeScript *

Web Worker easier than you thought


In this article, a DIRTY, unsafe, unstable and scary <em>eval</em> method will be described. So, if you are uncomfortable with that, stop reading right now.


First off, some issues with convenience remained unresolved: in code sent to web web workers, closure can't be used.




All of us like new technologies, and all of us like new technologies to be convenient to use. However, it's not exactly the case with web workers. web workers accept files or links to files, which isn't convenient. It would be good to be able to put any task into web workers, not just specifically planned code.


What do we need to make web workers more convenient to operate? I believe, it's the following:


  • A possibility to launch in web workers any code at any moment
  • A possibility to send to web workers complicated data (class instances, functions)
  • A possibility to receive a promise with a reply from a web worker.
Read more →
Total votes 6: ↑6 and ↓0 +6
Views 2.3K
Comments 0

Really typing Vue

Website development *JavaScript *VueJS *TypeScript *

Logo


inb4: This is not another "setting up" a new project with Vue and TypeScript tutorial. Let's do some deep dive into more complex topics!


typescript is awesome. Vue is awesome. No doubt, that a lot of people try to bundle them together. But, due to different reasons, it is hard to really type your Vue app. Let's find out what are the problems and what can be done to solve them (or at least minimize the impact).

Read more →
Total votes 11: ↑11 and ↓0 +11
Views 6.1K
Comments 1

Protocol for communication between iframe and the main window

Waves corporate blog Website development *JavaScript *TypeScript *
Translation

From time to time, developers need to establish communication between several browser tabs to be able to send messages from one tab to another and receive responses. We have also faced this need at some point.


Some solutions already exist (like, for instance, BroadcastChannel API). However, its browser support leaves a lot to be desired, so we decided to use our own library. When the library was ready, that functionality was no longer required. Nevertheless, another task emerged: communication between an iframe and the main window.


On closer examination, it turned out that two-thirds of the library would not have to be changed — only some code refactoring was necessary. The library is a communication PROTOCOL that can work with text data. It can be applied in all cases in which text is transferred, such as iframes, window.open, worker, browser tabs or WebSocket.


How it works


Currently, the protocol has two functions: sending messages and subscription to events. Any message in the protocol is a data object. For us, the main field in that object is type, which tells us what kind of message it is. The type field is an enum with the following values:

Read more →
Total votes 13: ↑12 and ↓1 +11
Views 2.8K
Comments 2

NodeJS logging made easy

JavaScript *Node.JS *Angular *TypeScript *


I now have a new shiny blog. Read this article with the latest updates there https://blog.goncharov.page/nodejs-logging-made-easy

How many times did you write logger.info('ServiceName.methodName.') and logger.info('ServiceName.methodName -> done.') for each and every method of your service you wanted to log? Would you like it to be automated and has the same constant signature across your whole app? If that's so, we're very much alike, we have suffered the same pain too many times, and now we could finally try to resolve it. Together. Ladies and gentlemen, let me introduce… class-logger!

Read more →
Total votes 13: ↑11 and ↓2 +9
Views 2.6K
Comments 0

Announcing TypeScript 3.4 RC

Microsoft corporate blog JavaScript *Programming *Visual Studio *TypeScript *

Some days ago we announced the availability of our release candidate (RC) of TypeScript 3.4. Our hope is to collect feedback and early issues to ensure our final release is simple to pick up and use right away.


To get started using the RC, you can get it through NuGet, or use npm with the following command:


npm install -g typescript@rc

You can also get editor support by



Let’s explore what’s new in 3.4!


Read more →
Total votes 9: ↑8 and ↓1 +7
Views 1K
Comments 0

Announcing TypeScript 3.3

Microsoft corporate blog Programming *.NET *TypeScript *

If you’re unfamiliar with TypeScript, it’s a language that brings static type-checking to JavaScript so that you can catch issues before you even run your code – or before you even save your file. It also includes the latest JavaScript features from the ECMAScript standard on older browsers and runtimes by compiling those features into a form that they understand. But beyond type-checking and compiling your code, TypeScript also provides tooling in your favorite editor so that you can jump to the definition of any variable, find who’s using a given function, and automate refactorings and fixes to common problems.

Read more →
Total votes 14: ↑13 and ↓1 +12
Views 913
Comments 0

Vue, Storybook, TypeScript—starting a new project with the best practices in mind

JavaScript *VueJS *TypeScript *
Tutorial


(originally published on Medium)


I like writing React code. This might be an odd introduction to a story about Vue, but you need to understand my background to understand why I’m here discussing Vue.


I like writing React code and I hate reading it. JSX is a neat idea for assembling the pieces together fast, Material-UI is amazing solution for bootstrapping your next startup’s UI, computing CSS from JS constants allows you to be very flexible. Yet reading your old JSXs feels awful – even with scrupulous code review practices you might scratch your head not once as you try to figure the intricate nesting of the components.


I’ve heard many things about Vue—the not so new kid on the block—and I finally decided to get my feet wet; bringing in all my mental luggage of React and Polymer (and Angular, but let’s not talk about that).

Read more →
Total votes 18: ↑17 and ↓1 +16
Views 19K
Comments 2

The ever-lasting strife of static vs dynamic typing – TypeScript won’t help

JavaScript *.NET *TypeScript *
Translation


When my friend and I were of school age and aspiring to become software developers, we daydreamed of designing some cool stuff together – like a game or a mega-useful app.

I chose to learn C++ and C#, he picked JavaScript. We finished school, graduated from our universities, served in the army and started our jobs. We had a pretty busy time in industrial software engineering, with lots of different jobs and positions, and after it all started to wear on us, we recalled where it all had begun.

Having finally got together as mature developers, we decided to work on our own project – a 2D video game. Since my friend’s domain was front-end and I was a full-stack developer, our immediate choice of development platform was an Internet browser. As I was only used to working with TypeScript when designing front-end, we thought, ok, no problem, after all, TS is just JavaScript at scale. Let’s use it and things will go smoothly. If I only knew how wrong I was! When we started discussing the project, we ran into an extensive chasm of misunderstanding between us.
Read more →
Total votes 23: ↑20 and ↓3 +17
Views 3.9K
Comments 1

How to setup front-end project with automated formatting, linting, testing and auto-generated documentation

Website development *JavaScript *Programming *DevOps *TypeScript *
Tutorial


Original post in Russian


Keeping your code consistent and well formatted not an easy task even when you work alone. But when you work with a team or with open source project all start getting even harder. Everyone has own code style, someone doesn’t run tests, and no one writes documentation. This article will help you to set up all these things and even more — automate this routine to never do it manually.


After reading you will get your own npm-ready project with next features:

Read more →
Total votes 23: ↑21 and ↓2 +19
Views 3.4K
Comments 0

Authors' contribution