Giter Site home page Giter Site logo
Michael Alvarez photo

awwmicky Goto Github PK

followers: 17.0 following: 26.0 repos: 18.0 gists: 0.0

Name: Michael Alvarez

Type: User

Company: @Arcane-404

Bio: ๐—™๐—ฟ๐—ผ๐—ป๐˜-๐—˜๐—ป๐—ฑ ๐—ฆ๐—ผ๐—ณ๐˜๐˜„๐—ฎ๐—ฟ๐—ฒ ๐—˜๐—ป๐—ด๐—ถ๐—ป๐—ฒ๐—ฒ๐—ฟ

Twitter: awwmicky

Location: Bay Area, CA

Blog: https://aww-micky.web.app

๐ŸŽˆ

ย  Hola, nice to meet ya ๐Ÿ‘‹

Got a project idea? Let's get in touch

email ย  phone ย  resume ย  calendly ย  linkedin ย  twitter

gh-page ย  gh-readme

aww-micky.web.app

<hr />

My Recent Projects

<hr />

Who I Am ๐Ÿ˜Ž

const Michael_Alvarez = {
  summary    : 'builds digital solutions for SaaS products & B2B marketing',
  roles      : [ 'Front-End Software Engineer', 'UI Developer', 'Problem Solver' ],
  interests  : [ 'Headless CMS', 'Serverless Functions', 'JAM Stack' ],
  key_values : [ 'curious', 'collaborative', 'creative' ],
  type_check : true && '~ ๐š–๐š˜๐š—๐š˜๐šœ๐š™๐šŠ๐šŒ๐šŽ ๐š›๐šž๐š•๐šŽ๐šœ ~',
  nickname   : ( 'micky' || 'zoda' ),
}

<hr />

What I know ๐ŸŒŽ

Tools I use on a daily basis

skill-icons

Tools I am interested to learn

jam-stack ย  storybook ย  graphql ย  apollo ย  trpc ย  prisma

testing-library ย  jest ย  cypress ย  playwright

sanity.io ย  contentful ย  strapi ย  prismic ย  storyblok ย  hygraph

What is my current tech stack?
BASE - Web Development 
TypeScript        :: type safety transpiler
Vite              :: build tool
Next.js           :: SSR & SSG framework
React             :: js framework/library

typescript vite next.js react

UI - Component-Driven Development 
Sass              :: css preprocessor
Tailwind CSS      :: css framework/library
Twin Macro        :: tailwind compiler tool
Styled-Components :: css-in-jsx
Framer Motion     :: react motion library

sass tailwind-css twin-macro styled-components framer-motion

API - Data-Driven Development 
Zustand         :: global state management (for ui data)
React Query     :: async state management (for api data)
React Router    :: routing state management
React Hook Form :: form state management
Zod             :: schema declaration & validation
Ky              :: promise-based http request

zustand react-query react-router react-hook-form zod ky

What I deep dive into, experiment?
Framer Motion framer-motion
Three.js three.js
P5.js p5.js
Green Sock (GSAP) green-sock
WebGL webgl
SVG (Animation) svg
Canvas canvas
What challenges do I think about?

How to build from design system to ui library?

e.g. figma, zeplin, react, storybook

How to type check specific data?

e.g. async data, form data, generic props

How to integrate these technologies?

e.g. tRPC, Prisma, PlanetScale

How to compose content strategy for Headless CMS projects?

i.e. content structure, repeat content usage, real-time collaboration

How to improve & maintain web performance for build time?

i.e. import sizes, image optimizations, reusable components

How to manage service costs?

i.e. api usage, run server, data analytics

What otherly things can I learn to make?

  • creative coding
  • generative art
  • digital art (media, interactive)

<hr />

GH Stats ๐Ÿ“ˆ

github-stats top-languages

github-contribution-grid-snake

๐Ÿ’ญ Ask Me Anything ย  ๐Ÿ‘€ Click Any Badge ย  ๐Ÿค Open Source Software

(โ•ฏยฐโ–กยฐ)โ•ฏๅฝก โ”ปโ”โ”ป ย  เน‘เน‘เน‘ ๏พ ส•โ€ขแดฅโ€ข;ส”

aww-micky.web.app

<hr />

Michael Alvarez's Projects

awwmicky icon awwmicky

๐š†๐šŽ๐š•๐šŒ๐š˜๐š–๐šŽ ๐š๐š˜ ๐š–๐šข ๐™ถ๐š’๐š๐™ท๐šž๐š‹ ๐™ฟ๐š›๐š˜๐š๐š’๐š•๐šŽ ๐Ÿ“‡

awwmicky.github.io icon awwmicky.github.io

๐š†๐šŽ๐š•๐šŒ๐š˜๐š–๐šŽ ๐š๐š˜ ๐š–๐šข ๐™ถ๐š’๐š๐™ท๐šž๐š‹ ๐™ฟ๐š˜๐š›๐š๐š๐š˜๐š•๐š’๐š˜ ๐Ÿ“ฐ

url-shortener-app icon url-shortener-app

A web app that cleans up the look of any URL links, sharing them made simple.

win10-master-setup icon win10-master-setup

My custom Windows 10 initial PC environment setup. Automate: settings - security - privacy - optimize - installs

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.