DEV Community: Birol AYDIN

Update with a single command

Birol AYDIN — Sun, 10 Nov 2024 19:27:05 +0000

Instead of doing the updates one by one via the command line, let's do them all with a single command.

When installing Deno and TypeScript, we use the following commands respectively. If we consider that there are more and add that we run them one by one... Instead, let's write a small script with PowerShell to make our job easier.

irm https://deno.land/install.ps1 | iex

npm install -g typescript@next

# .\script.ps1

# Bun update
powershell -c "irm https://bun.sh/install.ps1 | iex"
Write-Output "`e[1;32mBun was installed successfully!`n`n`e[0m"


# Deno update
Invoke-RestMethod https://deno.land/install.ps1 | Invoke-Expression
Write-Output "`e[1;32mDeno was installed successfully!`n`n`e[0m"

# Typescript update
npm install -g typescript@next
Write-Output "`e[1;32mTypeScript was installed successfully!`n`n`e[0m"

# Rust ( nightly toolchain ) update
rustup toolchain install nightly
Write-Output "`e[1;32mRust was installed successfully!`n`n`e[0m"

GraphQL-JIT Basic Example

Birol AYDIN — Wed, 02 Oct 2024 17:39:54 +0000

npm i -D typescript tsx

npm i --save-dev graphql @graphql-tools/schema graphql-jit

import { makeExecutableSchema } from "@graphql-tools/schema";
import { parse } from "graphql";
import { compileQuery, isCompiledQuery } from "graphql-jit";

const typeDefs = `
  type Query {
    hello: String
    goodbye: String
    users: [User!]!
  }

  type User {
    name: String!
    age: Int!
  }
`;

const users = [
  {
    name: "John",
    age: 30
  },
  {
    name: "Jane",
    age: 25
  }
];

const resolvers = {
  Query: {
    hello: () => "World!",
    goodbye: () => "Goodbye!",
    users: () => users
  },
};

const schema = makeExecutableSchema({ typeDefs, resolvers });

const query = `
  query GetHello {
    hello
  }

  query GetGoodbye {
    goodbye
  }

  query GetUsers
  {
    users
    {
      name
      age
    }
  }
`;

const document = parse(query);

const compilerOptions = {
  customJSONSerializer: true,
};

const operationName = "GetUsers";

const compiledQuery = compileQuery(schema, document, operationName, compilerOptions);

if (!isCompiledQuery(compiledQuery)) {
  console.error(compiledQuery);
  throw new Error("Error compiling query");
}

const executionResult = await compiledQuery.query(null, null, null);
//console.log(executionResult);
console.log(JSON.stringify(executionResult, null, 2));

Expo, React Hook Form + TypeScript❤️ + Zod

Birol AYDIN — Wed, 28 Aug 2024 09:42:02 +0000

Hello, we are back with a simple content. A simple form example using typescript zod react-hook-form while creating a form in the Expo ecosystem.

Let's get started without further ado.

Let's prepare the expo installation and development environment



npx create-expo-app RNHF-demo --template blank-typescript

cd RNHF-demo

code .

Let's install other npm packages



npm install @hookform/resolvers

npm i react-hook-form

npm i react-native-paper

npm i react-native-safe-area-context

npm i zod



import { Text, View, Button, StyleSheet } from "react-native";
import { useForm, Controller, SubmitHandler } from "react-hook-form";
import { z } from "zod";
import { zodResolver } from "@hookform/resolvers/zod";
import { TextInput } from "react-native-paper";

export default function App() {
  const userSchema = z.object({
    username: z
      .string()
      .min(5, { message: "Username must be at least 5 characters." })
      .max(30, { message: "Username must be at most 30 characters." }),
    email: z.string().email({ message: "Please enter a valid email address." }),
    age: z.number().min(18, { message: "You must be over 18 years old." }),
  });

  type UserFormType = z.infer<typeof userSchema>;

  const {
    control,
    handleSubmit,
    formState: { errors },
  } = useForm<UserFormType>({
    resolver: zodResolver(userSchema),
  });

  const onSubmit: SubmitHandler<UserFormType> = (data: UserFormType) => {
    console.log(data);
  };

  return (
    <View style={styles.container}>
      <Controller
        control={control}
        render={({
          field: { onChange, onBlur, value },
          fieldState: { error },
        }) => (
          <View>
            <TextInput
              mode="outlined"
              label="Username"
              onBlur={onBlur}
              onChangeText={onChange}
              value={value}
              activeOutlineColor={error ? "red" : "black"}
              style={styles.input}
            />
          </View>
        )}
        name="username"
      />
      {errors.username && (
        <Text style={{ color: "#ff8566" }}>{errors.username.message}</Text>
      )}

      <Controller
        control={control}
        render={({
          field: { onChange, onBlur, value },
          fieldState: { error },
        }) => (
          <TextInput
            mode="outlined"
            label="E-mail"
            onBlur={onBlur}
            onChangeText={onChange}
            value={value}
            activeOutlineColor={error ? "red" : "black"}
            style={styles.input}
          />
        )}
        name="email"
      />
      {errors.email && (
        <Text style={{ color: "#ff8566" }}>{errors.email.message}</Text>
      )}

      <Controller
        control={control}
        render={({
          field: { onChange, onBlur, value },
          fieldState: { error },
        }) => (
          <TextInput
            mode="outlined"
            label="Age"
            onBlur={onBlur}
            onChangeText={(text) => {
              const parsed = parseInt(text, 10);
              onChange(isNaN(parsed) ? "" : parsed);
            }}
            value={
              value === null || value === undefined ? "" : value.toString()
            }
            placeholder="Yaş"
            keyboardType="numeric"
            activeOutlineColor={error ? "red" : "black"}
            style={styles.input}
          />
        )}
        name="age"
      />
      {errors.age && (
        <Text style={{ color: "#ff8566" }}>{errors.age.message}</Text>
      )}

      <Button title="Submit" onPress={handleSubmit(onSubmit)} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    marginVertical: 10,
    padding: 8,
  },
  input: {
    marginVertical: 10,
  },
});

Let's run our application



npx expo start

Using Entity Framework Core 8 Owned Types HasData()

Birol AYDIN — Thu, 26 Oct 2023 17:21:15 +0000

First, let's write two sample classes

public class Person
{
    public int Id { get; set; }
    public string FirstName { get; set; } = null!;
    public string LastName { get; set;} = null!;

    public Contact PersonalInformation { get; set; } = null!;
}

using Microsoft.EntityFrameworkCore;

[Owned]
public class Contact
{
    public string PhoneNumber { get; set; } = null!;
    public string EmailAddress { get; set; } = null!;
}

Let's create the Person Table with the help of DbContext class and Entity Framework Core.

public sealed class ApplicationDbContext(DbContextOptions<ApplicationDbContext> options) : DbContext(options)
{
    public DbSet<Person> People => Set<Person>();

    protected override void OnModelCreating(ModelBuilder modelBuilder)
    {
        base.OnModelCreating(modelBuilder);

        modelBuilder.Entity<Person>(p =>
        {
            p.HasData(
                new Person
                {
                    Id = 1,
                    FirstName = "Person 1",
                    LastName = "Surname 1"
                },
                new Person
                {
                    Id = 2,
                    FirstName = "Person 2",
                    LastName = "Surname 2"
                },
                new Person
                {
                    Id = 3,
                    FirstName = "Person 3",
                    LastName = "Surname 3"
                });

            p.OwnsOne(e => e.PersonalInformation).HasData(new
            {
                PersonId = 1,
                EmailAddress = "EmailAddress 1",
                PhoneNumber = "1111111111111111"
            },
            new
            {
                PersonId = 2,
                EmailAddress = "EmailAddress 2",
                PhoneNumber = "22222222222222"
            },
            new
            {
                PersonId = 3,
                EmailAddress = "EmailAddress 3",
                PhoneNumber = "3333333333333333"
            });
        });
    }
}

Now it's time to create the database with the entity framework migration command and then update the database.

Add-Migration Initial

Update-Database

that is all . enjoy your work 😊

Installing Elasticsearch and Kibana with Docker compose

Birol AYDIN — Tue, 09 May 2023 23:18:21 +0000

Briefly installing Elasticsearch and Kibana with Docker compose.
You can work with Elasticsearch and Kibana running in docker environment by following the steps below. ```

//Windows powershell
mkdir Elasticsearch8.7.1

cd Elasticsearch8.7.1

New-Item -Path "docker-compose.yml"

code .

**NOTE: Before running docker-compose, make sure Docker is installed and running on your computer :)
**

// docker-compose.yml
version: '3'
services:
elasticsearch:
container_name: elasticsearch
image: docker.elastic.co/elasticsearch/elasticsearch:8.7.1
# 8.x
environment: ['CLI_JAVA_OPTS=-Xms2g -Xmx2g','bootstrap.memory_lock=true','discovery.type=single-node','xpack.security.enabled=false', 'xpack.security.enrollment.enabled=false']
ports:
- 9200:9200
networks:
- elastic
ulimits:
memlock:
soft: -1
hard: -1
nofile:
soft: 65536
hard: 65536
deploy:

resources:
limits:
cpus: '2.0'
reservations:
cpus: '1.0'

kibana:
image: docker.elastic.co/kibana/kibana:8.7.1
container_name: kibana
environment:
XPACK_ENCRYPTEDSAVEDOBJECTS_ENCRYPTIONKEY: d1a66dfd-c4d3-4a0a-8290-2abcb83ab3aa
ports:
- 5601:5601
networks:
- elastic
deploy:

resources:
limits:
cpus: '2.0'
reservations:
cpus: '1.0'

networks:
elastic:

In the directory where docker-compose is located

docker-compose up

You can see the containers working from Docker Desktop application. Click on the links Elasticsearch and kibana to see that both are ready to use.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/30d57qx41lbra87y62g0.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eflz1jzp9woku39ah84z.png)