Diseñando documentación para diseño web

Necesitamos replantear cómo debería funcionar la documentación para proyectos de diseño web. Tenemos las herramientas, pero no las metodologías, y este articulo habla sobre cómo podemos comenzar a construirlas.

El abismo entre Diseño e Ingeniería

Los frontenderos a veces somos los que estamos más cerca de los equipos de diseño y de ingeniería, y entendemos la separación y la unión de ambas disciplinas. O, al menos es lo que deberíamos entender. En este articulo exponen porqué a veces los proyectos fallan cuando no hay coordinación entre diseño e ingeniería y cómo podemos remediarlo.

Como iniciar un nuevo trabajo

En este articulo, Amy Hupe hace una breve guía de cómo afronta nuevos trabajos y lo que representa. ¡Muy útil para tu primer semana de trabajo nuevo!

HERRAMIENTA
MeltUI

MeltUI, es una biblioteca para construir componentes accesibles y de calidad para Svelte, y tiene una pinta bien chula.👌 Recomendación Frontendera de la semana.

Kinde

Kinde, es una herramienta para proveer autenticación a tus proyectos y ¡es gratuita hasta 7500 usuarios!, así que, si estas buscando una alternativa a Auth0. deberías probar esta.

NOTICIA
Prettier 3.1

Nueva versión de Prettier que trae los siguientes cambios: identacion para ternarios anidados, soporte para los cambios en Angular 17 ¡y más!

VACANTE
Desarrollador Sr Frontend React

Si tienes inglés avanzado y llevas al menos 3 años desarrollando frontend en aplicaciones con stacks tecnológicos como; JavaScript, HTML 5, React, Typescrpt, entre otros, en Baufest, tienen una buena oportunidad para ti.

CHALLENGE

Escenario del Desafío: Imagina que estás creando un juego que incluye un laberinto. El laberinto se representa como una matriz 2D, donde 0 representa una pared y 1 representa un camino. Tu tarea es escribir una función que encuentre un camino desde la esquina superior izquierda hasta la esquina inferior derecha del laberinto.

Descripción del Reto:

• Dada una matriz 2D que representa el laberinto, escribe una función findPath en JavaScript que encuentre un camino a través del laberinto.

• La función debe devolver el camino como una serie de coordenadas (por ejemplo, [[0,0], [1,0], [1,1], ...]), o un mensaje indicando que no hay camino.

• Puedes asumir que el punto de inicio siempre será [0, 0] y el punto de destino [matriz.length - 1, matriz[0].length - 1].

Ejemplo de un Laberinto:

let maze = [
    [1, 0, 1, 1, 1],
    [1, 0, 1, 0, 1],
    [1, 1, 1, 0, 1],
    [0, 0, 0, 1, 1]
];

RESULTADO

Para resolverlo, se puede utilizar el algoritmo de búsqueda en profundidad (Depth-First Search, DFS).

function findPath(maze) {
    const rows = maze.length;
    const cols = maze[0].length;
    const path = [];
    const visited = Array.from({ length: rows }, () => Array(cols).fill(false));

    function dfs(x, y) {
        // Si la posición está fuera del laberinto o es una pared, retornamos false
        if (x < 0 || y < 0 || x >= rows || y >= cols || maze[x][y] === 0 || visited[x][y]) {
            return false;
        }

        path.push([x, y]);
        visited[x][y] = true;

        // Si hemos llegado a la esquina inferior derecha, retornamos true
        if (x === rows - 1 && y === cols - 1) {
            return true;
        }

        // Explorar arriba, abajo, izquierda y derecha
        if (dfs(x + 1, y) || dfs(x, y + 1) || dfs(x - 1, y) || dfs(x, y - 1)) {
            return true;
        }

        // Si no se encuentra un camino, retrocedemos y marcamos la celda como no visitada
        path.pop();
        visited[x][y] = false;
        return false;
    }

    if (dfs(0, 0)) {
        return path;
    } else {
        return "No hay camino disponible";
    }
}