DEV Community: Saulo Vargas

How to be a newbie (without others realize it)

Saulo Vargas — Tue, 22 Jun 2021 17:02:12 +0000

Hello everyone, I am @sauloco Senior Fullstack Developer, JavaScript/TypeScript specialist, who loves VueJS and Jamstack.

I have been many times in both sides of the following situation:

Project Manager (aka PM): - I need you to create a responsive view to show all stats of a single Pokémon based in the Pokedex API.
Junior Dev: - Ok. Perfect. (internally: 😱 * overwhelmedly blocked, don't know where to start *)

If you also would feel a bit anxious in this scenario, don't worry, I will give you some tips and tools:

1. Do ask questions!

Giving enough time some questions will become unnecessary, but always, I mean always you will have some doubts when starting a new task, this is not just normal but also a good thing.

As experienced as you become you may even ask some questions you already know the answer "just to be sure". Knowing the right answer is better than guessing.

2. Think "programmatically"

A PM may throw several buzzwords in a sentence without realize they imply several steps, or even, many tasks: "responsive view" and "API" consumption in the previous example could be easily different tasks with different team members working on it.

In order to organize this thoughts you could create an internal script. A series of pseudocode instructions for your brain, sequentially ordered so you can focus on analyze every step's complexity.

Let's use the previous example again to apply this strategies:

const result = fetch("pokemon api");
// Question: do I need credentials for this API?
// Question: what API version will we be using?
if (result.error) {
  // Question: how should it react in case of error?
  return false;
}

const { data } = result;

const renderResult = render(data);
const responsiveRender = addResponsiveness(renderResult);

const finalResult = display(responsiveRender);

return finalResult;

What other questions can you ask to the PM for the steps render, addResponsiveness and display? Comment below as if it would be your task.

3. Set clear expectations and keep communication open

Many teams already have this sorted out, in that case you will need to learn how to use this channel properly, otherwise you can propose a way to give and receive feedback.

When will the task evaluation be ready? In 2 hours? 4 hours? tomorrow morning?
To be honest, unless your PM explicitly asked for that, it doesn't matter if do it at light speed, but it's more important to be accountable.

Again, with enough experience you will be able to make this almost in real time, but you do remember: you must be clear about next steps and technical recommendations.

Summary

Do ask questions!, probably when you think you don't need any clarification it's because you don't completely understand the problem. That is a good starting point.
Think "programatically", ok, you are not a robot, but you can think like one of them. Structure your ideas as a mental script.
Set clear expectations and keep communication open, they must know when and what will you bring back to the table. Keep the PM (and/or client) up-to-date and in-the-loop as much as possible.

Comment below if you've been involved in this kind of situation when somebody ask for something and you kinda overwhelmed yourself. Let's make therapy together.

Thanks for reading.

Como NO parecer un Junior cuando te asignan una tarea (incluso siendo Junior)

Saulo Vargas — Sun, 20 Jun 2021 01:31:27 +0000

Hola a todos, soy @sauloco Senior Fullstack Developer especialista en Javascript/Typescript que tiene debilidad por VueJS y todo el Jamstack.

He visto muchas veces la siguiente situación (y estado en ambos lados de la misma):

Project Manager (PM): - Necesito que crees una vista responsive que muestre toda la información de un Pokemon basado en la API de la Pokedex.
Junior Dev: + Ok, perfecto. (internamente: 😱 * se bloquea por no saber para donde ir *)

Si pensar en esta situación te genera un poquito de ansiedad, no te preocupes, te voy a dar algunos tips y herramientas que te van a servir.

1. Haz todas las preguntas que creas necesarias

Con el paso del tiempo cada vez menos preguntas te serán necesarias, pero siempre, repito, siempre tendrás dudas a la hora de comenzar con una nueva tarea, esto es normal y no depende de cuánta experiencia tengas.

Con el paso del tiempo verás que hay preguntas que se hacen para estar seguros, incluso cuando ya intuyas la respuesta.

2. Piensa "programaticamente"

Un PM puede incluir varias palabras en una oración como "responsive", "vista", "API" sin detenerse a pensar en que lo que está pidiendo involucra distintas tareas.

Ten un sistema claro para organizarlas como si fuesen un script mental. Una suerte de pseudocódigo propio donde puedas ordenar las tareas secuencialmente para que puedas analizar su complejidad individualmente.

Continuemos el ejemplo con tareas ficticias:

const result = fetch("pokemon api");
// PREGUNTA: necesito credenciales para llamar a dicha API o es publica?
// PREGUNTA: hay más de una version de dicha API? si es así, cuál version de la API debería utilizar?
if (result.error) {
  // PREGUNTA: qué debería hacer si el pedido a la API falla?
  return false;
}

const { data } = result;

const renderResult = render(data);
const responsiveRender = addResponsiveness(renderResult);

const finalResult = display(responsiveRender);

return finalResult;

Que preguntas le harias al PM para las tareas render, addResponsiveness y display? Comentalas abajo como si fuesen tu tarea.

3. Establece expectativas y vías de comunicación claras

Muchos equipos ya tienen mecanismos para resolver el feedback de una tarea, aprende a utilizarlos o propone una forma que te quede cómoda.

Cuándo vas a tener lista la evaluación de la tarea?
...en 2 horas? en 4 horas? Mañana?
No es tan importante cuándo, pero sí asegúrate de acordar un momento para revisar y asesorar a quien este solicitando los requerimientos con toda la información técnica que hayas podido recabar.

Junior Dev: + Perfecto, con todas las preguntas que te hice creo que en "X horas"/"mañana a X hora" voy a tener el panorama claro de qué se requiere para completar esta tarea.

Con el tiempo, la experiencia y haber hecho la misma tarea varias veces puede que logres hacer esto incluso en el momento, pero siempre deja en claro cuáles son los pasos a seguir y cuáles son tus recomendaciones técnicas.

Al momento de hacer la devolución técnica
Junior Dev: + La API es de acceso público pero requiere credenciales, quién solicitará las mismas?
La documentación de la version x.xx.xxx de la API se puede encontrar en https://docs.de-la-poke-api.com/x
....
Comenzare a implementar los pasos 1 y 2 mientras espero las respuestas 3 y 4.

Resumen

Haz todas las preguntas que creas necesarias, si crees que no necesitas preguntar nada para generar la solución es porque todavía no has entendido bien el problema. Comienza a preguntar por ahí.
Piensa "programaticamente", no eres un robot, pero puedes pensar como uno. Ordena tus ideas como si fuesen un script mental.
Establece expectativas y vías de comunicación claras, que sepan cuándo y con qué vas a volver, mantén al PM/cliente lo más involucrado y al tanto posible.

CSS Plugin for Chrome

Saulo Vargas — Tue, 28 May 2019 14:53:44 +0000

Hello, a few days ago I saw a Chrome plugin (I think it was) that allows you to click an element and shows a popup with all the CSS applied to this element.
I think it's a great tool, and I want to use it, but I can't recall the name of it, or even I can't find it googling (or even duckducking).

Can anyone help me please?

Locution as a service

Saulo Vargas — Tue, 22 Jan 2019 14:59:46 +0000

I was searching for a platform to do this, but couldn't find it.

Then I want to create a platform where:

Customer request for a reading of certain text, and an offer.
People apply to the offer and set a time frame to deliver.
Customer choose between people who offered based in time frame and portfolio.

Locution as a service.
Freelance working for locution professionals.

If you know some service like this in the web, please, comment with a link, I couldn't find one.

The idea comes from:

Building a product in a week

Miguel Piedrafita ・ Jan 21 '19

#showdev #product #maker #audio

What do you think about it?
Would it be useful?

🐛 Bug or feature 💡

Saulo Vargas — Wed, 09 Jan 2019 20:27:55 +0000

In case you never heard that expression:

Excuse made by software developers when they try to convince the user that a flaw in their program is actually what it's supposed to be doing. - Urban dictionary

Please don't be shy and share your (own or other's) bug-or-feature moments.

10 free-but-professional tools for your dev projects

Saulo Vargas — Mon, 07 Jan 2019 15:15:09 +0000

This article has the #translated tag: Leer el artículo en español

Welcome to the first of this series "Free - as in free beer" where we'll analyze online resources with free versions we can use without trade off the quality of our project.

Most of this free-plan-versions of this services are somehow restricted, but you'll see they can fit perfectly in the dev phase of your project.

1 Google Documents
Main function: To create and share documents between a team.
Additional function: To download a PDF with the document.
Hidden trade-off: To tell Google all our secret plans?

2 Trello
Main function: To reduce the story from the previous document and divide it in lists, cards and checkboxes making it easy for the team to handle and easy for the client to understand.
Hidden trade-off:

You can't add more than one integration (power-up)
You can't have added files bigger than 10MB

3 Heroku
Main function: To host the server side logic and configuration (I usually work with NodeJS APIs) in their containers (dynos)
Additional function:

To deploy automatically the changes sent from developing terminal.
To save safely and usefully the aplication's secret information (env vars, tokens, passwords)

Hidden trade-off: The free dynos only have 512 MB RAM & 1 web per worker.

4 MLab
Main function: To host a MongoDB database and get a URL where to point our server side logic.
Hidden trade-off: Database can't be larger that 500 MB. Automatic backups aren't possible as vertical or horizontal scalling.

5 Netlify
Main function: To host a static web client and provide an URL to access the content.
Additional function:

To get a custom URL pointing our own domain.
To get SSL certificates for every domain or subdomain pointing their nameservers to Netlify's DNS.

Hidden trade-off: only one user per proyect, security and permission configurations are limited.

6 Freenom
Main function: To get a TLD for free.
Hidden trade-off: TLD with none or low reputation, hard to remind (can be solved with creativity). The domain get a price when it isn't renewed on time, sometimes the price becomes premium, and you can lost your domain for a few months. After that it'll become available for free again.

7 Keybase
Main function: Private git repository and team chat.
Additional function:

Identity validation service.
Group and subgroup chat with channels.
Safe file share.
URL for public files.
250 GB storage.
Git repos scope: public, group, subgroup, invididual.
All activity in the platform is encrypted.
Clients for main OSs, no web client.
Direct client support

Hidden trade-off: The project still is a proof of concept, and their apps are constantly getting modifications (not a trade-off on itself but a comment)

8 Github
Main function: (we all know it, I'll explain how I use it in my stack)
Aditional function: Netlify integration, it allows me to deploy code automatically.
Hidden trade-off: Github only allows public repos as free, then, I can use them for front-end only, no secrets here.

9 Sentry
Main function: Error monitoring.
Hidden trade-off: Only available in personal projects or early-stage apps

10 VS Code
Main function: To edit code.
Función adicional:

Native integration with git
Thousands of extensions
Real time colaboration, even in debugging sessions.

Hidden trade-off: To tell Microsoft all our secret plans?

Later in this series, I'll dig deeper about how I use every tool, so you can leave your questions here and I'll use them to write the new articles.
Also I hope your comments in this and the next articles will improve the information, you can suggest new tools or new ways to use the shared tools.

10 herramientas gratuitas (pero profesionales) para proyectos de desarrollo

Saulo Vargas — Mon, 07 Jan 2019 14:31:46 +0000

Este artículo tiene la etiqueta #translated: Read it in english

Bienvenidos al primero de esta serie de artículos "Free - as in free beer" (bueno, en español no tiene chiste) donde analizaremos una serie de recursos online que puedes usar gratuitamente sin vender la calidad de tu proyecto.

Seguramente, al ser gratuitos, muchos servicios estarán restringidos de alguna forma, pero verás que se ajustan perfectamente a las necesidades de un proyecto en fase de desarrollo.

1 Google Documents
Función principal: Creación de documentos compartidos en equipo para redactar el análisis y presupuesto. Permite descargar un PDF con el documento generado, listo para presentarlo al cliente.
Costo oculto: ¿Contarle a Google todos nuestros planes secretos?

2 Trello
Función principal: Tomar como base el documento anterior y dividirlo listas, tarjetas y checkboxes para que resulte fácil de manejar para el equipo y fácil de entender para el cliente.
Costo oculto: El servicio básico es completamente gratuito. No puedes agregar más de una integración (Power-up) por tablero y cada archivo adjunto puede ser de 10MB como máximo.

3 Heroku
Función principal: Alojar la lógica y configuración del servidor (en mi caso siempre trabajo con APIs NodeJS) en free dynos ofrecidos promocionalmente por Heroku.
Función adicional:

Desplegar automáticamente los cambios enviados desde la terminal de desarrollo.
Guardar de forma segura y a la vez utilizable la información secreta de la aplicación (variables de entorno, tokens, contraseñas). Costo oculto: Los free dynos solo tienen 512 MB RAM y 1 web/1 worker.

4 MLab
Función principal: Alojar la base de datos y obtener una URL fija a la que apuntar nuestra lógica de servidor.
Costo oculto: La base de datos no debe superar los 500 MB. No se pueden crear backups automáticos. No se puede escalar vertical ni horizontalmente.

5 Netlify
Función principal: Alojar el cliente web de la API. Obtener una URL para acceder al contenido.
Función adicional:

Obtener una URL personalizada apuntando a un dominio propio.
Obtener certificados SSL para todos los dominios (o subdominios) que apunten sus nameservers a los DNS del servicio. Costo oculto: Equipos de un solo usuario, opciones de seguridad y permisos más limitados.

6 Freenom
Función principal: Obtener un dominio de nivel superior completamente gratuito.
Costo oculto: Son dominios con baja reputación o dificiles de recordar (aunque en realidad depende de la creativiad y el idioma). Si no se renueva a tiempo pasa a tener un costo (a veces premium) lo que hace a veces imposible recuperar el nombre de dominio por un tiempo (meses), pasado ese tiempo vuelve a estar disponible como gratuito.

7 Keybase
Función principal: Repositorio git privado y chat de equipo.
Función adicional:

Servicio de validación de identidad.
Chat de grupos con subgrupos y canales.
Intercambio seguro de archivos públicos (url para archivos públicos) o privados.
250 GB de capacidad de almacenamiento.
Repositorios git públicos, grupales e individuales.
Encriptación de toda la actividad en la plataforma.
Clientes para las principales plataformas, excepto web. Costo oculto: Aún está en fase de prueba de concepto, los clientes para móvil o PC están en constante desarrollo con actualizaciones permanentemente.

8 Github
Función principal: (ya todos lo conocemos, pero voy a explicar para qué lo uso exactamente) Utilizar la integración con Netlify y desplegar automáticamente mis desarrollos.
Costo oculto: Solo permite repositorios públicos como gratuitos por lo tanto lo utilizo sólo para la lógica de cliente, ningún secreto.

9 Sentry
Función principal: Monitoreo de errores en fase de producción.
Costo oculto: Solo para proyectos personales y en fases iniciales.

10 VS Code
Función principal: Editar código.
Función adicional:

Integración nativa con git,
Múltiples extensiones
Colaboración a tiempo real hasta las instancias de debugging con otros miembros del equipo.

Costo oculto: ¿Contarle a Microsoft todos nuestros planes secretos?

Durante la serie, en articulos posteriores, iré ahondando más profundamente en cómo uso yo cada una de estas herramientas, pero espero que tanto en este como en los próximos artículos ustedes también participen y propongan nuevas herramientas o nuevas formas de usar las que se sugieren.

Proposal: translate your own content to your native language

Saulo Vargas — Tue, 01 Jan 2019 16:26:10 +0000

I know you know, at least, read and write in english, but you don't live in England, nor USA, nor Australia... you aren't an english native speaker, in fact your dream (like mine) is to fly to London and improve your english practicing it everyday!

So, why you wrote that beautiful post just in one language that isn't your native one?
How difficult could be to translate it? Probably you originally created that article in your native language inside your mind after all.
You know what happens when an automatic translator try to do that job 🤷‍♂️

My proposal to you:

Write your article in english, good!
Translate it to your mother language, great!
Put the tag #translated in both articles
Put a link, a reference, in both articles to the other version.

What do you think about this proposal?

.ltag__tag__id__5637 .follow-action-button{ background-color: !important; color: !important; border-color: !important; }

#translated

Note: I won't translate this article because I want all the comments remain centralized here.

How to (not) read dev.to 🤓

Saulo Vargas — Tue, 01 Jan 2019 15:29:30 +0000

👆 I just found this two posts together in the list, ironic, but random (I think so)

I'll share their URLs if you want to read them, but it isn't mandatory for understand this post:

Note: I won't critique the articles here, in fact, I read them and found them useful to be confident and post this article, you'll see why soon.
Note 2: there is an spanish version of this post thing that I encourage to do to everybody who isn't native english speaker, try to post your article in english AND in your mother tongue also (you can join this discussion here)

Como (no) leer dev.to 🤓

Saulo Vargas ・ Jan 1 '19 ・ 2 min read

#career #translated #spanish

May be for someone who is taking their first steps in this professions to find a community like dev.to could be the greatest thing, because they could think this community will provide them that cuote of experience that they don't have (yet) and think they will be learning to implement ideas from rockstars developers.

Ok, that could be true at some point, but here is my thought about it:

Reviewing endless lists and tags we can found piece of advices like

What technology suit best for this task?
What framework suit best for this technology?
What workflow suit best for this framework?
What jargon suit best for this workflow?

Of course, that's an amazing knowledge to be learn! I'm sure is very important to know (at least the existence of) every new technology, framework, etc.

And here it is: the moment when you expect me to say "but"...

I won't use that B word...

I just want to ¿warn? to those who, like me, thought they had been found a community filled with "magical solutions" to complex problems: nope, it is not that kind of community 😬

Hey, that doesn't mean you can't found solutions reading posts, obviously you can, however, I'd like to make a point here: This community is extremely powerful, do you want to know why?

here you'll find multiple information sources
here you'll find true discussions (mostly constructive ones) between members, and even authors,

This tools are powerful because will allow you, regardless how "newbie" you are:

to discover reasons behind the plain information,
to create your own judgement over the plain information,

Finally, you'll end up with a better quality information that the original plain information itself could give you, and that quality will allow you to implement that "magical solutions" using your own wisdom.

I really want to say thanks to all of you to take from your time to share, to give advices, to teach... because even if nobody follow your advice at least they'll know why they took that desicion, and they won't be tempted to make that desicion because just another guy/girl say that's the thing to do.

Just to close the point: many times we are upset because the press isn't broad enough to reflect all the voices, then the people is biased to think as they want.

Here happens exactly the opposite thing! And at my best judgment that's the most powerful tool of all!

Really, thanks for your posts!

Como (no) leer dev.to 🤓

Saulo Vargas — Tue, 01 Jan 2019 13:27:11 +0000

👆 Encontré estos dos posts juntos en la lista, irónico, pero aleatorio (quiero creer)

Para aquellos que no sepan inglés los títulos dicen:

Nota: Este post no es una crítica a esos artículos, de hecho, los leí y me dieron más confianza aún para escribir este, ya verán porqué.
Nota 2: You can find an english version of this article.

How to (not) read dev.to 🤓

Saulo Vargas ・ Jan 1 '19 ・ 3 min read

#carreer #beginners #translated

Tal vez para alguien dando sus primeros pasos en estas profesiones encontrar una comunidad como dev.to le puede parecer que es excelente porque cree que ha encontrado algo que le proporcionará esa experiencia que le falta, que puede directamente implementar las ideas de los mejores.

Por muy cierto y bueno que parezca, dejenme comentarles lo que pienso al respecto.

Revisando las interminables listas y etiquetas encontramos consejos como:

qué tecnologías se recomiendan para determinada tarea,
qué frameworks se recomiendan sobre esas tecnologías,
qué workflows se recomiendan sobre esos frameworks,
qué jerga se recomienda para comunicar esos workflows,

Claro que son conocimientos invaluables! Es indispensable conocer toda nueva tecnología, framework

Aquí es la parte donde ustedes esperan que yo diga "pero..."

No voy a decir "pero".

Solo quisiera ¿advertirles? a aquellos que, como yo, en algún tiempo creían haber encontrado una comunidad llena de "soluciones mágicas" a problemas complejos, que no, no es así, nada más lejos de la realidad.

No significa que no se puedan encontrar soluciones leyendo los posts de dev.to, sí las hay, sin embargo, lo que me gustaría puntualizar es que lo que tienen frente a sus ojos es más poderoso que eso:

en dev.to encuentras múltiples fuentes de información,
discusiones (mayormente constructivas) entre los miembros, donde incluso el propio autor participa,

Estas son las herramientas que te permitirán a ti mismo, sin importar lo "novato" que seas a:

descubrir las razones detrás de la información,
hacer tu propio juicio sobre la información,

Finalmente, tendrás mejor calidad de información, llegarás a mejores conclusiones y estas te permitirán implementar esas soluciones mágicas por tu propia cuenta.

Realmente quiero agradecer a todos los que se toman el tiempo de recomendar, avisar, enseñar, compartir, promover... porque incluso si nadie toma en cuenta tu consejo, aviso, recomendación, enseñanza, etc, al menos sabrán porqué tomaron esa desición y no será porque se dejaron llevar por lo primero que encontraron.

Para compararlo con un hecho concreto: muchas veces nos enoja que la prensa de cierto lugar no sea lo suficientemente amplia como para dejar escuchar todas las voces y que el pueblo sea quien se forme su propia opinión, eso, señores y señoras, eso es lo que realmente sucede aquí. A mi entender esa es la herramienta más poderosa de todas.

Realmente, gracias por sus posts!