lorisleiva

Integrating the Metaplex JS SDK with React apps

• 4️⃣ Create React App 4 (using Webpack 4)
• 5️⃣ Create React App 5 (using Webpack 5)
• ⚡️ React with Vite

Create React App 4 (using Webpack 4)

Steps to install a CRA 4 app from scratch using the SDK:

lorisleiva

Access Google API credentials and domain verification

This gist describes two processes allowing us to access the Google API and to register some webhooks. At the end of both processes we will obtain all variable needed to start using their API and we will have whitelisted all necessary URL to get started. We will be using the Google Calendar API and the Google Plus API to access the email address of the user.

This gist has been created as an Appendix to this article (part 1) and this article (part 3).

_{Note that, I will be using a randomly generated ngrok domain during this presentation. Simply replace b3093b51.ngrok.io with your domain name}

lorisleiva

Install Solana on Apple M1

Unfortunately, at the time of writing, the Solana installer script above will not work on Apple M1 computers.

The installation will be successful and you’ll be able to call solana commands but other Solana binaries such as solana-test-validator will throw various errors since it’s expecting dependencies to be located elsewhere. If you’ve already installed it that way, no worries, simply run rm -rf ~/.local/share/solana to uninstall Solana.

I’ll be sure to update this article if/when this will work out-of-the-box for M1 computers.

In the meantime, we’ve got a little workaround to go through. We need to clone the Solana repository and compile the binary from the source code. Don’t worry, the installation process is still super simple, it just takes a bit longer due to the compilation time. Here are the steps.

lorisleiva

<?php

use Illuminate\Database\Eloquent\Builder;

Builder::macro('toSqlWithBindings', function () {
    $bindings = array_map(
        fn ($value) => is_numeric($value) ? $value : "'{$value}'",
        $this->getBindings()
    );

lorisleiva

name: My Workflow
on: [push]

jobs:
  build:
    runs-on: ubuntu-latest
    container: 
      image: lorisleiva/laravel-docker:7.4
    steps:
    - uses: actions/checkout@v2

lorisleiva

// resources/js/models/Model.js

export default class Model {
    constructor (attributes = {}) {
        this.fill(attributes)
    }

    static make (attributes = {}) {
        return Array.isArray(attributes)
            ? attributes.map(nested => new this(nested))

lorisleiva

<script setup>
import useLocalStorage from './useLocalStorage'
const publicKey = useLocalStorage('solana-wallet-public-key')
</script>

<template>
    <div>
        <input type="text" v-model="publicKey">
        <div v-text="publicKey"></div>
    </div>

lorisleiva

From f54a9349cb1205bf34d04d2900cf5e1e69228480 Mon Sep 17 00:00:00 2001
From: Loris Leiva <loris.leiva@gmail.com>
Date: Thu, 14 Mar 2024 15:13:08 +0000
Subject: [PATCH] Fix exported extensions in package.json

---
 clients/js/package.json   | 8 ++++----
 clients/js/tsup.config.ts | 1 +
 2 files changed, 5 insertions(+), 4 deletions(-)

lorisleiva

import { createSetAuthorityInstruction, AuthorityType } from '@solana/spl-token';
import { Transaction } from '@solana/web3.js';

const instruction = createSetAuthorityInstruction(
  token.publicKey,
  closeAuthority.publicKey,
  AuthorityType.CloseAccount,
  null
);

lorisleiva

export function pipeline(initialValue, pipes, then) {
  then = then ?? ((t) => t);
  const pipelineCallback = pipes
    .slice()
    .reverse()
    .reduce((next, pipe) => (passable) => pipe(passable, next), then);

  return pipelineCallback(initialValue);
}