recipe - Kononov Space

recipe

A collection of 11 posts

[RECIPE]: distinct operation for array

[RECIPE]: distinct operation for array

Being web full stack developer after years of .NET work sometimes brings you to a blind alley. For example, such trivial thing as `.distinct()` function for array, which is not present in TS/JS. So, let's find out how to do the same. const data: ItemType[] = [{id: 1}, {id: 1}

[RECIPE]: array flatten and distinct in TS

[RECIPE]: array flatten and distinct in TS

I caught up myself on a thought that I have looked to a way to flatten array in TS several times this year. Probably, I had bad memory and cannot remember this easily. But maybe, it's more because this is not something you do everyday. So, let's keep the recipe

[RECIPE]: Capitalize in CSS

[RECIPE]: Capitalize in CSS

There are cases when you want your text looks fine as header in browser, but you don't know if text has correct case of the first letter. It can easily fixed with the simple CSS rule: .txt-capitalized { text-transform: capitalize; }

[RECIPE]: Check error throw in jest

[RECIPE]: Check error throw in jest

Jest is something which millions of people uses everyday, a lot of questions are answered. But I keep finding something new for me every day. This is not gonna work: describe('throw test', () => { it('should throw the error', () => { expect(throwingFunc()).toThrow(); }); }); Test will fail with the error you are looking

[RECIPE]: floating rounded table rows with CSS

[RECIPE]: floating rounded table rows with CSS

If your designer wants to have table rows floating one above another, with some space between, and having rounded borders, follow this: :root { --border-radius: 5px; } table { background-color: gray; border-collapse: separate; border-spacing: 0 2px; } tr { background-color: white; } td:first-child { border-bottom-left-radius: var(--border-radius); border-top-left-radius: var(--border-radius); } td:last-child { border-bottom-right-radius: var(--border-radius);

[RECIPE]: fix vulnerable sub-dependencies in package.json

[RECIPE]: fix vulnerable sub-dependencies in package.json

Regular Typescript or Javascript project has number of dependencies from NPM. Most of them have own dependencies, different versions of them. To see them all you can review auto generated file package-lock.json. Different versions of some library can be used in range of other libraries. Which can cause dependencies

[RECIPE]: Callstack in Javascript

[RECIPE]: Callstack in Javascript

When debugging legacy javascript code you might need to know who called this function. The simple solution for it - using Error Object, which has stack information. console.log(new Error('Stack Trace').stack)

[RECIPE]: bootstrapSwitch events firing

[RECIPE]: bootstrapSwitch events firing

If you by any chance still have jQuery and use things like bootstrapSwitch, you can meet this situation: When switch is setup like this $('id').bootstrapSwitch('state', true) you immediately can observe that switchChange is fired. Which could be normal, not a big deal. But if you have system of

[RECIPE]: AWS ECS deployment and Health Checks

[RECIPE]: AWS ECS deployment and Health Checks

Recently my regular deployment of NestJS Backend API to Amazon ECS service failed without any meaningful reasons. What I see is that Docker container is taken, everything inside is executed successfully, I see logs of service which has started and even (but why) some requests to my endpoints. Seems like

[Recipe]: Save Canvas content to File on server

[Recipe]: Save Canvas content to File on server

Save to File If you have some logic with images, drawing or blurring in javascript, you might want to save image back to server. Here is how to use toBlob function: const canvas = document.getElementById("canvasID"); canvas.toBlob(bytes => { // here is saving of actual image file content save(bytes); }); save