Skip to content

Instantly share code, notes, and snippets.

Avatar
🙏
Never stop learning

Omar López zomars

🙏
Never stop learning
View GitHub Profile
@zomars
zomars / README.md
Created May 30, 2022
End to end API type safety with SWR and Next.js
View README.md

Idea

Being able to auto type API endpoint according the use. This could be achieveable using TypeScript template literals.

Example:

Having these API endpoints:

  • /api/users
  • /api/companies
@zomars
zomars / README.md
Created May 30, 2022
End to end API type safety with SWR and Next.js
View README.md

Idea

Being able to auto type API endpoint according the use. This could be achieveable using TypeScript template literals.

Example:

Having these API endpoints:

  • /api/users
  • /api/companies
@zomars
zomars / DangerousRawHtml.jsx
Created May 30, 2022
Inject raw html comments using React
View DangerousRawHtml.jsx
export const DangerousRawHtml = ({ html = "" }) => (
<script dangerouslySetInnerHTML={{ __html: `</script>${html}<script>` }} />
);
@zomars
zomars / modularized-nextjs-project-strucutre.md
Last active Jul 28, 2022
Reusable Next.js project structure
View modularized-nextjs-project-strucutre.md

File structure

The main file structure is organized as follows:

├── __test__
├── assets
├── configs
├── modules
│   ├── common (Here is what is reused in various modules)
@zomars
zomars / [slug].js
Created Apr 6, 2021 — forked from agungjk/[slug].js
Crawler example on Vercel using Puppeteer and NextJS API routes
View [slug].js
const puppeteer = require('puppeteer-core');
const cheerio = require('cheerio');
const chrome = require('chrome-aws-lambda');
export default async (req, res) => {
const slug = req?.query?.slug;
if (!slug) {
res.statusCode = 200
res.setHeader('Content-Type', 'application/json')
res.end(JSON.stringify({ id: null }))
View Magic Link 2
View Magic Link 1
@zomars
zomars / useRtDbData.js
Last active Jul 30, 2020 — forked from dsafreno/withDbData.js
Hook version of dsafreno's withDbData for RealTime Database subscribing in React.
View useRtDbData.js
import { useEffect, useRef, useState } from 'react';
import firebase from 'firebase/app';
import equal from 'deep-equal';
function filterKeys(raw, allowed) {
if (!raw) {
return raw;
}
const s = new Set(allowed);
return Object.keys(raw)
@zomars
zomars / renderFieldsArray.js
Created Aug 29, 2018
Render redux-form Fields component
View renderFieldsArray.js
const renderFields = fields =>
Object.keys(fields).map((name, i) => {
if (!fields[name].input) return null;
return (
<Grid item xs={12}>
<Field
key={name}
name={name}
label={fields.labels[i]}
{...fields[name]}
View responsive-logo-04.html
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<style>
.square,
.landscape { visibility: hidden; }
.portrait { visibility: visible; }
@media (min-aspect-ratio: 1/1) {
.portrait,
.landscape { visibility: hidden; }
.square { visibility: visible; }