I was wondering how we could solve the oncoming global problem of vaccination proof. For example, I can imagine in near future in order to be able to get on to the aeroplane, one will have to provide proof of COVID-19 vaccination. Here’s how I can imagine a worldwide blockchain solution.
There’s a publicly available blockchain that shows all the issued COVID-19 vaccination certificates. Besides that, this blockchain keeps the information about authorities that can issue them.
Since the blockchain is publicly available for everyone, there is no personal information that would allow someone to know exactly who was vaccinated…
I was recently playing with Tailwind CSS framework with React. One of the things that bothered me were these long className=”…” declarations. I personally don’t like to have too much style related stuff in my JSX. I think it makes things much less readable and that’s why I’m a fan of Styled Components' way of declaring styles. But I figured out I could try to use Tailwind and just declare these class names in a more readable manner.
Here is an example of how you could implement <Card /> in the most straightforward way:
And here how it can…
Let say you have started building a project using yarn workspaces. Since you’re developing some small “api” and “web” services you want to keep a “shared” package where you’ll keep common js utilities for your project, like for example field validators or some constants or whatever else you find convenient to share. Yarn workspaces are perfect for such scenarios, but when it comes to packing your services to Dockerfiles you can stumble upon some new issues.
Yarn workspaces will move (hoist) most of the dependencies of your services in root level node_modules folder. Because of that you will have to…
I will explain a concept of authentication flow I’m exercising recently in my full-stack projects. If you’re crazy enough to build your own authentication with Apollo and JWT this may be an inspiration for you.
I recently wanted to check if it’s possible to create a simple js chat with no servers in-between, so that you can directly talk with someone else via secure channel.
I found that some browsers support WebRTC. It wasn’t clear for me at the beginning how to deal with it but eventually I was able to establish p2p connection with my friends in different networks. There is still a need for STUN/TURN servers to establish connection but as far as I know it’s secure.
Currently demo chat works in Firefox. I had some issues with STUN servers in Chrome. I…
I will walk you through setting up basic Express server with TypeScript. By “basic” I mean:
I assume you have node and typescript globally installed.
Let’s create our directory:
mkdir express-boilerplate && cd express-boilerplate
Set up git:
Set up npm:
npm init -y
Add all dependencies we will need:
I found myself copy pasting the same configuration over and over every time I start new “create-react-app” project, so here is how I always start.
I’m using create-react-app v3.1.1 as of writing this document (September 18th, 2019)
I will show here how to setup a project in a certain configuration:
Bootstrap a new typescript project:
npx create-react-app create-react-app-boilerplate --typescript && cd create-react-app-boilerplate
Install all dev dependencies (eslint + prettier):
npm i -D eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser prettier…
(As of: September 8, 2019)
I recently was investigating how I can approach building simultaneously web and mobile apps in a most optimal way. At first I started a Lerna monorepo approach where I could have my shared package with all the code I want to share with web and mobile. But I quickly noticed that there’s a ton of issues bundling it properly and wiring it, especially with Expo/React Native.
First of all, I think Lerna monorepo is a good way to keep web & mobile apps together. What I did a bit differently is that I would keep…
Let’s say you want to create an NPM package with React components styled in styled-components and you also want to use Typescript.
Let’s assume your library is going to be named
I prepared a boilerplate repository that will allow you to easily develop and deploy your components library to NPM. It’s based on Typescript version of rollup-starter-lib + I added and configured an example-app based on Typescript version of Create React App that will let you test your library and publish a demo to GitHub pages.
Clone the boilerplate repo and navigate to root folder:
If you ever will struggle with typing HOC in React here are some code snippets that could help you.
Let say you have a simple
withTheme HOC, that provide additional
theme property to your Component.
Now let’s see how we could type this code:
Ok, let’s walk through this code.
First, we have
Omit type that is really helpful in typing HOCs. Since our HOC is providing
theme prop, if we wrap Component in
withTheme the resulted Component don’t need
theme prop anymore. What
Omit is doing is removing from ones type another’s type keys: