v3.0.0-alpha.0

3.0-alpha

The 3.0-alpha.0 release is out today. We got on a call and did the release together. The GitHub release workflows at the time were triggered on x.y.z versions, to trigger it on x.y.z-[alpha|beta], we agreed on modifying regex in CI to `[0-9]+.[0-9]+.[0-9]+*' with a star at the end.

On the terminal, Dianna ran pnpm version prerelease --preid=alpha to make the release.

Prisma

Since the integration of Supabase, we bring Postgres into Telescope's stack. It is being used to store Feeds, Profiles, Quotes, GitHub issues. Before, we defined our database models inside Postgres initialization scripts. This works fine for persistent schema where we have reached the final state. However, if we want to modify the existing schema, let's say, adding new columns or tables, we need a way to migrate the existing database to use the new schema. That's why we need migration tools such as Prisma.

Prisma is a "Next-generation Node.js and TypeScript ORM". It's a batteries-included tool for database management.

What is ORM and DB Migrations anyway?

ORM or Object-relational mapping is the idea of being able to write queries using the object-oriented paradigm of your preferred programming language.

Database migrations basically track granular changes to your database schema (and sometimes to your data as well). These granular changes are typically reflected as separate scripted files. That way, your granular schema changes are reflected as code that can be captured with any version control software.

Usage

If there are existing models in the database, Prisma introspects the current schema and exports it to schema.prisma, where every model is defined.


cd src/db
pnpx prisma db pull

Running migration is easy with one command. It is smart enough to track granular changes to your db schema and warns you of potential data losses or anything that needs attention. After the migration, a new migration script is created. The migration script must be committed to source control.


pnpx prisma migrate dev

Sometimes we want to do custom DB migrations, i.e, adding RLS rules to the existing tables. We can do so by creating an empty migration script and applying the migration manually.


pnpx prisma migrate dev --create-only // create the migration
Add SQL queries in the newly createdmigration.sqlfile
pnpx prisma migrate dev // apply migration


React Native

This week I helped @beamazedvariable work on displaying Blog posts on the home screen of our mobile app. This is the first time I worked on React-native and I'm really impressed by toolings to we got to build Native mobile apps with React. It was fun to learn about React native, the differences and similarities vs writing React on the web:

• Expo CLI is a command line app that is the main interface between a developer and Expo tools.
• An expo app can run on the browser
• Instead of HTML elements, basic native components are exported from react-native such as View for containers, Text for raw texts, SrollView for scrollable content, etc
  • There is no DangerouslyInnerHTML prop to display raw Blog HTML from the server. Luckily, https://meliorence.github.io/react-native-render-html is a neat library for rendering HTML into 100% native views with custom tags renderers and CSS styles
• A large part of JS code from the main web app could be copied over to the mobile app
• Many CSS properties are not yet supported

Copy Button

I collaborated with @menghif to build to copy button for code snippets inside a blog. The final solution is a React copy component that uses MUI styles. The button is then rendered into pure HTML element using ReactDOM API. I really enjoyed the pop-up behaviour of the copy button.

Migrate feeds to PostgreSQL

Using the existing Feeds migration service, I wrote a small script to pull all feeds from the Planet Feed to PostgreSQL using the supabase-js API. Thanks to @pandanoxes 's work on securing the Supabase-studio behind GitHub OAuth, Telescope developers can now manage the database through a central UI.

I love that we can all look at the same Supabase console and make changes live