<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: David E Luna M</title>
    <description>The latest articles on DEV Community by David E Luna M (@dlunamontilla).</description>
    <link>https://dev.to/dlunamontilla</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F339905%2F02628110-6dbf-4c0f-9506-4c2f146d6061.jpeg</url>
      <title>DEV Community: David E Luna M</title>
      <link>https://dev.to/dlunamontilla</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/dlunamontilla"/>
    <language>en</language>
    <item>
      <title>Evaluar si una propiedad existe en un objeto</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Wed, 13 Jan 2021 14:43:18 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/propiedad-de-un-objeto-2n6m</link>
      <guid>https://dev.to/dlunamontilla/propiedad-de-un-objeto-2n6m</guid>
      <description>&lt;h3&gt;
  
  
  Varias maneras de hacerlo
&lt;/h3&gt;

&lt;p&gt;Se puede evaluar si una propiedad determinada se encuentra incluida en un objeto y les presentaré, al menos, tres forma de hacerlo.&lt;/p&gt;

&lt;p&gt;Asumiendo que tenemos el siguiente objeto:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;objeto&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;propiedad&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Valor de la propiedad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Primera forma:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="nx"&gt;objeto&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;propiedad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;undefined&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Segunda forma:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="nx"&gt;objeto&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;hasOwnProperty&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;propiedad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Tercera forma:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;propiedad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt; &lt;span class="nx"&gt;objeto&lt;/span&gt; &lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;O también:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;propiedad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt; &lt;span class="nx"&gt;objeto&lt;/span&gt; &lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="c1"&gt;// Realizar acciones&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>javascript</category>
      <category>object</category>
    </item>
    <item>
      <title>Ventana Modal - Para Ilustrar</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Wed, 10 Jun 2020 10:27:07 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/ventana-modal-para-ilustrar-1f9m</link>
      <guid>https://dev.to/dlunamontilla/ventana-modal-para-ilustrar-1f9m</guid>
      <description>&lt;p&gt;Ventana Modal utilizando cajas flexibles, a la vez que se aplicó la metodología BEM en su implementación.&lt;/p&gt;

&lt;p&gt;Esta es una publicación en respuesta a: ¿Cómo mostrar correctamente elementos dentro de un modal?&lt;/p&gt;

&lt;p&gt;Se puede acceder siguiendo la ruta =&amp;gt; &lt;a href="https://es.stackoverflow.com/questions/364042/como-mostrar-correctamente-elementos-dentro-de-un-modal/364091#364091"&gt;https://es.stackoverflow.com/questions/364042/como-mostrar-correctamente-elementos-dentro-de-un-modal/364091#364091&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/OJMMpOK?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Cuadrados Anidados - Animaciones</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Sat, 23 May 2020 05:52:10 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/cuadrados-anidados-animaciones-4ffd</link>
      <guid>https://dev.to/dlunamontilla/cuadrados-anidados-animaciones-4ffd</guid>
      <description>&lt;h2&gt;
  
  
  Animaciones con Cuadrados
&lt;/h2&gt;

&lt;p&gt;Animación con figuras geométricas. En este caso, cuadrados utilizando efectos sencillos, tales como, perspectiva, transformaciones de estilos y rotación.&lt;/p&gt;

&lt;p&gt;Solamente HTML y CSS.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/XWmGKxN?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Figura ¿Quién quiere ser Millonario?</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Sat, 23 May 2020 05:49:42 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/figura-quien-quiere-ser-millonario-2ah9</link>
      <guid>https://dev.to/dlunamontilla/figura-quien-quiere-ser-millonario-2ah9</guid>
      <description>&lt;p&gt;Botones de que «quién quiere ser millonario». Se hizo en respuesta a una pregunta surgida en Stack Overflow.&lt;/p&gt;

&lt;p&gt;La pregunta la pueden ubicar en:
&lt;a href="https://es.stackoverflow.com/questions/347748/transformaci%c3%b3n-de-button-o-input-de-forma-din%c3%a1mica?noredirect=1#comment628139_347748"&gt;https://es.stackoverflow.com/questions/347748/transformaci%c3%b3n-de-button-o-input-de-forma-din%c3%a1mica?noredirect=1#comment628139_347748&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/QWjKxyx?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Archivador Físico</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Fri, 13 Mar 2020 05:42:27 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/archivador-fisico-3e9o</link>
      <guid>https://dev.to/dlunamontilla/archivador-fisico-3e9o</guid>
      <description>&lt;p&gt;Figura con apariencia de un archivador físico. Solo tiene que colocar el cursor sobre ella y luego hacer clic.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/NWqYxOV?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Plantillas HTML5 &lt;template&gt; | Formulario</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Wed, 26 Feb 2020 10:16:25 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/plantillas-html5-template-formulario-mga</link>
      <guid>https://dev.to/dlunamontilla/plantillas-html5-template-formulario-mga</guid>
      <description>&lt;p&gt;Para utilizarlo, pruebe escribiendo un título en un contenido en el formulario. Una vez que hayas terminado presione el botón Agregar o las teclas Ctrl + Enter.&lt;/p&gt;

&lt;p&gt;Esta acción formarán unas tarjetas, colocando la última de primero.&lt;/p&gt;

&lt;p&gt;Por ahora, esto no es funcional para entornos de producción pero puede ayudar al desarrollo de herramientas similares.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/jOPyJmG?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Permite colocar 30.000 caractereres, a la vez que los cuenta.&lt;/p&gt;

&lt;h2&gt;
  
  
  Translation to English
&lt;/h2&gt;

&lt;p&gt;To use it, try writing a title on a content on the form. Once you're done, press the Add button or the Ctrl + Enter keys.&lt;/p&gt;

&lt;p&gt;This action will form some cards, placing the last of first.&lt;/p&gt;

&lt;p&gt;For now, this is not functional for production environments but may help the development of similar tools.&lt;/p&gt;

&lt;p&gt;Allows you to place 30,000 characters, while you count them.&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Origen de rotación</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Sun, 23 Feb 2020 12:31:02 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/origen-de-rotacion-1g76</link>
      <guid>https://dev.to/dlunamontilla/origen-de-rotacion-1g76</guid>
      <description>&lt;h3&gt;
  
  
  CSS - Origen de rotación / Rotation origin
&lt;/h3&gt;

&lt;p&gt;Cambiar dinámicamente el origen de rotación de la figura para entender un poco la propiedad &lt;code&gt;transform-origin&lt;/code&gt;.&lt;/p&gt;

&lt;h4&gt;
  
  
  Translation to English
&lt;/h4&gt;

&lt;p&gt;Dynamically change the rotation origin of the figure to understand a little the &lt;code&gt;transform-origin&lt;/code&gt; property.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/vYOyMRR?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Circunferencia de PI</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Sat, 22 Feb 2020 06:25:24 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/circunferencia-de-pi-8hj</link>
      <guid>https://dev.to/dlunamontilla/circunferencia-de-pi-8hj</guid>
      <description>&lt;p&gt;Es una circunferencia formada por caracteres numéricos del número PI. Se hizo para los programadores de &lt;strong&gt;Stack Overflow&lt;/strong&gt; y &lt;strong&gt;cualquier persona interesada&lt;/strong&gt; en utilizarla en sus proyectos.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/oNXgMqR?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
    <item>
      <title>Animación con borde sólido para ilustrar</title>
      <dc:creator>David E Luna M</dc:creator>
      <pubDate>Sat, 22 Feb 2020 06:17:31 +0000</pubDate>
      <link>https://dev.to/dlunamontilla/animacion-con-borde-solido-para-ilustrar-19aj</link>
      <guid>https://dev.to/dlunamontilla/animacion-con-borde-solido-para-ilustrar-19aj</guid>
      <description>&lt;p&gt;Animación de carga de &lt;em&gt;App&lt;/em&gt; con borde sólido para ilustrar cómo funciona.&lt;/p&gt;

&lt;p&gt;Recuerde que el diámetro de la circunferencia puede cambiarse cambiando el valor de la propiedad personalizada &lt;code&gt;--diametro&lt;/code&gt;, ubicada en la regla &lt;code&gt;:root&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Por ejemplo:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nd"&gt;:root&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="py"&gt;--diametro&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="m"&gt;100px&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Todo lo demás se escala.&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/dlunamontilla/embed/XWbjaBg?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;También publiqué en &lt;a href="https://es.stackoverflow.com/questions/329419/c%c3%b3mo-hacer-un-cargador-similar-html-y-css/331211#331211"&gt;&lt;strong&gt;Stack Overflow&lt;/strong&gt;&lt;/a&gt; una explicación un poco más detallada sobre cómo funciona la animación presentada acá.&lt;/p&gt;

</description>
      <category>codepen</category>
    </item>
  </channel>
</rss>
