The latest articles on DEV Community by rubenofen (@rubenofen). https://dev.to/rubenofen 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%2F339438%2F26cda5d4-4c21-4f8d-b53f-7b1738845ea6.jpg https://dev.to/rubenofen en rubenofen Wed, 07 Oct 2020 13:46:23 +0000 https://dev.to/nimbel/how-much-money-do-you-lose-for-every-second-it-takes-to-load-your-web-application-5f4i https://dev.to/nimbel/how-much-money-do-you-lose-for-every-second-it-takes-to-load-your-web-application-5f4i <p>Did you know that most people who have a profitable business idea, fail miserably just because they <strong>not</strong> make a reasonable investment in their sales tool?</p> <p>This is absolutely true and we have done an experiment in which it is confirmed that an incorrect decision can make you lose thousands of euros.</p> <p>Many times when we create a business, we realize that one of the most important sales channels is the internet and at that moment we decide to create our own <strong>web application</strong>.</p> <p>Usually we have to take many decisions and make important investments in different areas so that our product or service goes ahead. </p> <p>The first problem we face when creating the web application is: <br> **How many technologies do we have available and what are their costs? </p> <p>One of the technologies that entrepreneurs usually use is a CMS such as Wordpress, Joomla or Drupal, this is a very flexible solution and *<em>quite good</em>.</p> <p>It allows the entrepreneur to manage their own content, maintain it and modify it, in addition many companies offer to provide hosting or hosting for Wordpress with everything pre-configured.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--_3ZBqmle--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gdc1gquavurrkcnjmqzb.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--_3ZBqmle--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gdc1gquavurrkcnjmqzb.jpg" alt="Alt Text"></a></p> <p>There are also many developers of these CMS's that offer their services at a very competitive price...but...</p> <p>This hides a deeper problem that can turn the business into a ruin. **You have to take into account the user's behavior.</p> <p>According to a report from <a href="https://www2.deloitte.com/content/dam/Deloitte/ie/Documents/Consulting/Milliseconds_Make_Millions_report.pdf">Deloitte</a>, if your web application takes between 1 and 3 seconds to load the probability of bouncing increases by 32%, but if the loading time is in the range of 1 to 5 seconds, the probability of bouncing increases by up to 90% 😱.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--mkVOCBo_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/m0n2cl8vh95nrh7mo7g3.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--mkVOCBo_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/m0n2cl8vh95nrh7mo7g3.png" alt="Alt Text"></a></p> <h2> And what is the probability of rebound? </h2> <p>It is considered a rebound when a user enters a website and without interacting with it closes it because he is not interested in what is on it.<br> This is quite normal, because it's impossible to attract only users who are interested in your product or service to your website.<br> And what effect does it have on the business to increase the likelihood of a bounce because it takes a few seconds to load?</p> <h2> The experiment </h2> <p>Let's make the following assumption:<br> An entrepreneur has a business where he sells a service or an article for 100 ?, of this article 50 ? are costs and the other 50 ? are benefits.</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Sales price</th> <th>Costs</th> <th>Profit</th> </tr> </thead> <tbody> <tr> <td>100€</td> <td>50€</td> <td>50€</td> </tr> </tbody> </table></div> <p>Let's imagine that you manage to attract 4,500 users per month and if your application loaded instantly that's how users would behave:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visits</th> <th>% bounce</th> <th>users bounce</th> <th>Conversion ratio</th> <th>Profit per month</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>29%</td> <td>1.305</td> <td>2%</td> <td>3.195€</td> </tr> </tbody> </table></div> <p>In other words, of the total of 4,500 visits, 1,305 enter but instantly realize that they are not interested and leave without interacting and reading practically nothing.</p> <p>For both scenarios we propose a web application that will be working <strong>for 3 years</strong>.</p> <h3> Scenario A </h3> <p>The entrepreneur hires the development of a wordpress because he is convinced by the budget and the solution is already quite good, <strong>"I don't need that much "</strong>.</p> <h4> Budget: </h4> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Development</th> <th>Plugins</th> <th>Hosting/month(VPS)</th> </tr> </thead> <tbody> <tr> <td>1.200€</td> <td>300€</td> <td>70€</td> </tr> </tbody> </table></div> <p>Therefore: 1,200 + 300 + (70*3*12) = <strong>4,020</strong> in the 3 years</p> <h3> Scenario A </h3> <p>The entrepreneur hires the development of a wordpress because he is convinced by the budget and the solution is already quite good, <strong>"I don't need that much "</strong>.</p> <h4> Budget: </h4> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Development</th> <th>Plugins</th> <th>Hosting/month(VPS)</th> </tr> </thead> <tbody> <tr> <td>1.200€</td> <td>300€</td> <td>70€</td> </tr> </tbody> </table></div> <p>Therefore: 1,200 + 300 + (70*3*12) = <strong>4,020</strong> in the 3 years</p> <h4> Result </h4> <p>We have obtained this result from one of our clients, who has his product developed in wordpress and has the page hosted in a quality VPS, obviously we hide his brand so as not to damage his image.<br> We will look at the First Contenful Paint, which is the time that passes from the request of the page until the first piece of content that appears on your screen, either an image, an icon or some text.<br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--5RakvQtY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/h9368in2efowuil5pkpb.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--5RakvQtY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/h9368in2efowuil5pkpb.png" alt="Alt Text"></a></p> <p><strong>7 seconds</strong> 😱😨😰😥😓. If we look at Deloitte's graph, taking between 1 and 7 seconds to load means a 123% higher probability of rebound. And how do your business results look?</p> <p>The original bounce was 1,305 users out of 4,500, by increasing the bounce probability by 123% we will have 2,910 users that will bounce without buying anything. With this you only have 1,519 possible buyers left. **At this point, we could evaluate the cost of having attracted traffic to your website, but we'll leave that for another article.</p> <p>Numbers:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visits</th> <th>Bounces</th> <th>Interested parties</th> <th>Conversion ratio</th> <th>Sales</th> <th>Monthly profit</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>2.910</td> <td>1.590</td> <td>2%</td> <td>3.179,70€</td> <td>1.589,85€</td> </tr> </tbody> </table></div> <h3> Scenario B </h3> <p>The entrepreneur hires the JAMSTACK development a little more expensive but that has convinced him more, because he has been assured that his page will go at the speed of light and that will have a positive impact on his business. In addition, with the traffic that the hosting has, it is <strong>free</strong>.</p> <p>Quotation:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Professional Designer</th> <th>Development</th> <th>Hosting/month(VPS)</th> </tr> </thead> <tbody> <tr> <td>1.200€</td> <td>4.000€</td> <td>0€</td> </tr> </tbody> </table></div> <p>Therefore: 1,200 + 300 + (0*3*12) = <strong>5,200</strong> in the 3 years (if clearly <strong>30% more expensive</strong> in the 3 years)</p> <h3> Let's see stage B </h3> <p>Here we expose our website directly, hosted in vercel.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--f9Brogio--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/y369dz188d1bq5u3ceeo.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--f9Brogio--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/y369dz188d1bq5u3ceeo.png" alt="Alt Text"></a></p> <p>If we look at the image, 0.9s 🧐🤓😎🥳😏, a priori, has no bounce percentage penalty so the numbers setting up a business with a page with the JamStack stack would look like this.</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visits</th> <th>Bounces</th> <th>Interested users</th> <th>Conversion ratio</th> <th>Sales</th> <th>Profit month</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>1.305</td> <td>3.195</td> <td>2%</td> <td>6.390,00€</td> <td>3.195,00€</td> </tr> </tbody> </table></div> <p>We believe that the difference is more than noticeable, between 1,589 and 3,195 there are <strong>1,606<br> Have you thought what you can do with that extra money a month? The car of your dreams? The little house in the mountain? or even leave your job for good, if you are a part-time entrepreneur? **Those 1600 euros change everything.</strong></p> <h2> What happened after 3 years? </h2> <h3> Scenario A </h3> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Total benefits</th> <th>Web development</th> <th>Final result</th> </tr> </thead> <tbody> <tr> <td>57.234,60€</td> <td>4.020€</td> <td>53.214,60€</td> </tr> </tbody> </table></div> <h3> Scenario B </h3> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Total benefits</th> <th>Web development</th> <th>Final result</th> </tr> </thead> <tbody> <tr> <td>115.020,00€</td> <td>5.200€</td> <td><strong>109.820,00€</strong></td> </tr> </tbody> </table></div> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--YKR1iAPt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/sax5c03pam2x64es91r6.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--YKR1iAPt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/sax5c03pam2x64es91r6.jpg" alt="Alt text"></a></p> <blockquote> <p>Image from <a href="https://pixabay.com/es/users/StartupStockPhotos-690514/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=593313">StartupStockPhotos</a> in <a href="https://pixabay.com/es/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=593313">Pixabay</a></p> </blockquote> <p>That's more than 50,000 euros. Have you thought about what it costs you to win 50,000 euros to lose it because of a wrong decision?</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--tamFW6nb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/oraazbu1i1pkrx778y30.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tamFW6nb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/oraazbu1i1pkrx778y30.png" alt="Alt Text"></a></p> <p>In this experiment we have not taken into account the effect that having a professional designer who creates your own image and cares about the user experience, instead of using a template, can have. It's a summation and it goes on.</p> <p>Remember: **Good enough makes you poor</p> <p>Lucky you, at <a href="https://nimbel.vercel.app/">Nimbel</a> we are experts in websites, high performance applications, mobile applications and everything that software technology has to offer. <br> Contact us and tell us what you want to do and we will offer you the solution that best fits your project. Your success is our mission.</p> english jamstack speed business rubenofen Fri, 25 Sep 2020 08:41:47 +0000 https://dev.to/nimbel/cuanto-dinero-pierdes-por-cada-segundo-que-tarda-en-cargar-tu-aplicacion-web-2kfd https://dev.to/nimbel/cuanto-dinero-pierdes-por-cada-segundo-que-tarda-en-cargar-tu-aplicacion-web-2kfd <p>¿Sabias que la mayoría de la gente que tiene una idea rentable de negocio, fracasa estrepitosamente solo por <strong>no</strong> hacer una inversión razonable en su herramienta de ventas?</p> <p>Esto es totalmente cierto y hemos hecho un experimento en el que se confirma que una decision incorrecta puede hacerte perder miles de euros.</p> <p>Muchas veces cuando creamos un negocio, nos damos cuenta que uno de los canales más importantes de ventas es internet y en ese momento nos decidimos a crear nuestra propia <strong>aplicación web</strong>.</p> <p>Habitualmente tenemos que tomar muchas decisiones y hacer importantes inversiones en diferentes ámbitos para que nuestro producto o servicio salga adelante. </p> <p>El primer problema que se nos plantea a la hora de crear la aplicación web es: <br> <strong>¿Cuantas tecnologías tenemos disponibles y que coste tienen?</strong>. </p> <p>Una de las tecnologías que los emprendedores suelen usar es un CMS como Wordpress, Joomla o Drupal, esta es una solución muy flexible y <strong>bastante buena</strong>.</p> <p>Permite al emprendedor gestionar su propio contenido, mantenerlo y modificarlo, además muchas empresas se ofrecen a facilitar el alojamiento o hosting para Wordpress con todo preconfigurado.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--_3ZBqmle--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gdc1gquavurrkcnjmqzb.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--_3ZBqmle--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/gdc1gquavurrkcnjmqzb.jpg" alt="Alt Text"></a></p> <p>También hay muchos desarrolladores de estos CMS que ofrecen sus servicios a un precio muy competitivo...pero...</p> <p>Esto esconde un problema más profundo que puede convertir el negocio en una ruina. <strong>Hay que tener en cuenta el comportamiento del usuario.</strong></p> <p>Según un informe de <a href="https://www2.deloitte.com/content/dam/Deloitte/ie/Documents/Consulting/Milliseconds_Make_Millions_report.pdf">Deloitte</a>, Si tu aplicación web tarda entre 1 y 3 segundos en cargar la probabilidad de rebote aumenta en un 32%, pero si el tiempo de carga se encuentra en el rango de entre 1 y 5 segundos, la probabilidad de rebote aumenta hasta en un 90% 😱.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--mkVOCBo_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/m0n2cl8vh95nrh7mo7g3.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--mkVOCBo_--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/m0n2cl8vh95nrh7mo7g3.png" alt="Alt Text"></a></p> <h2> ¿Y que es la probabilidad de rebote? </h2> <p>Se considera un rebote cuando un usuario entra en una web y sin interacturar con ella la cierra porque no le interesa lo que en cuentra.<br> Esto es bastante normal, porque es imposible atraer a tu web sólo a usuarios que les interesa tu producto o servicio.<br> ¿Y que efecto tiene en el negocio aumentar la probalibilidad de rebote a causa un tardar unos segundos en cargar?</p> <h2> El experimento </h2> <p>Vamos a plantear el siguiente supuesto:<br> Un emprendedor tiene un negocio donde vende un servicio o un articulo por 100€, de este articulo 50€ son costes y los otros 50€ son beneficios.</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Precio venta</th> <th>Costes</th> <th>Beneficio</th> </tr> </thead> <tbody> <tr> <td>100€</td> <td>50€</td> <td>50€</td> </tr> </tbody> </table></div> <p>Imaginemos que consigue atraer 4.500 usuarios al mes y si su aplicación cargara al instante así se comportarían los usuarios:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visitas</th> <th>% de rebote</th> <th>usuarios rebote</th> <th>Ratio conversión</th> <th>Beneficio al mes</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>29%</td> <td>1.305</td> <td>2%</td> <td>3.195€</td> </tr> </tbody> </table></div> <p>O sea, del total de 4.500 visitas, 1.305 entran pero al instante se dan cuenta que no les interesa y salen sin interactuar y sin leer prácticamente nada.</p> <p>Para los dos escenarios planteamos una aplicación web que estará funcionando <strong>durante 3 años</strong>.</p> <h3> Escenario A </h3> <p>El emprendedor contrata el desarrollo de un wordpress porque le convence el presupuesto y la solución ya es bastante buena, <strong>"No necesito tanto"</strong>.</p> <h4> Presupuesto: </h4> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Desarrollo</th> <th>Plugings</th> <th>Hosting/mes(VPS)</th> </tr> </thead> <tbody> <tr> <td>1.200€</td> <td>300€</td> <td>70€</td> </tr> </tbody> </table></div> <p>Por tanto: 1.200 + 300 + (70*3*12) = <strong>4.020€</strong> en los 3 años</p> <h4> Resultado </h4> <p>Este resultado lo hemos obtenido de uno de nuestros clientes, que tiene su producto desarrollado en wordpress y tiene la página alojada en un VPS de calidad, evidentemente ocultamos su marca para no dañar su imagen.<br> Nos fijaremos en el First Contenful Paint, que es el tiempo que transcurre desde la solicitud de la página hasta que el primer fragmento de contenido que aparece en tu pantalla, ya sea una imagen, un icono o algún texto.<br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--5RakvQtY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/h9368in2efowuil5pkpb.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--5RakvQtY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/h9368in2efowuil5pkpb.png" alt="Alt Text"></a></p> <p><strong>7 segundos</strong> 😱😨😰😥😓. Si miramos el gráfico de Deloitte tardar entre 1 y 7 segundos en cargar implica un 123% más de probabilidad de rebote. ¿Y cómo le quedan los resultados de su negocio?</p> <p>El rebote original eran 1.305 usuarios de 4.500, al aumentar un 123% la probabilidad de rebote tendremos 2.910 usuarios que rebotarán sin comprar nada. Con esto sólo te quedan 1.519 posibles compradores. <strong>En este punto podríamos valorar el coste de haber atraido el tráfico a tu web, pero eso lo dejamos para otro artículo.</strong></p> <p>Números:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visitas</th> <th>Rebotes</th> <th>Interesados</th> <th>Ratio conversión</th> <th>Ventas</th> <th>Beneficio mes</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>2.910</td> <td>1.590</td> <td>2%</td> <td>3.179,70€</td> <td>1.589,85€</td> </tr> </tbody> </table></div> <h3> Escenario B </h3> <p>El emprendedor contrata el desarrollo JAMSTACK un poco más caro pero que le ha convencido más, porque le han asegurado que su página irá a la velocidad de la luz y eso repercutirá positivamente en su negocio. Además, con el tráfico que tiene el alojamiento le sale <strong>gratis</strong>.</p> <p>Presupuesto:</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Diseñador profesional</th> <th>Desarrollo</th> <th>Hosting/mes(VPS)</th> </tr> </thead> <tbody> <tr> <td>1.200€</td> <td>4.000€</td> <td>0€</td> </tr> </tbody> </table></div> <p>Por tanto: 1.200 + 300 + (0*3*12) = <strong>5.200€</strong> en los 3 años (si claramente es un <strong>30% más caro</strong> en los 3 años)</p> <h3> Veamos el escenario B </h3> <p>Aquí exponemos nuestra web directamente, alojada en vercel.</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--f9Brogio--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/y369dz188d1bq5u3ceeo.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--f9Brogio--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/y369dz188d1bq5u3ceeo.png" alt="Alt Text"></a></p> <p>Si miramos la imagen, 0.9s 🧐🤓😎🥳😏, a priori, no tiene penalización en el porcentaje de rebote así que los números montando un negocio con una página con el stack JamStack quedarían así.</p> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Visitas</th> <th>Rebotes</th> <th>Usuarios interesados</th> <th>Ratio conversión</th> <th>Ventas</th> <th>Beneficio mes</th> </tr> </thead> <tbody> <tr> <td>4.500</td> <td>1.305</td> <td>3.195</td> <td>2%</td> <td>6.390,00€</td> <td>3.195,00€</td> </tr> </tbody> </table></div> <p>Creemos que la diferencia es más que notable, entre 1.589 y 3.195 hay <strong>1.606€</strong>.<br> ¿Has pensado que puedes hacer con ese dinero extra al mes? ¿El coche de tus sueños? ¿La casita en la montaña? o incluso ¿Dejar el trabajo por cuenta ajena definitivamente?, si eres emprendedor part-time. <strong>Esos 1.600€ lo cambian todo.</strong></p> <h2> ¿Que ha pasado al cabo de 3 años? </h2> <h3> Escenario A </h3> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Beneficios totales</th> <th>Desarrollo web</th> <th>Resultado final</th> </tr> </thead> <tbody> <tr> <td>57.234,60€</td> <td>4.020€</td> <td>53.214,60€</td> </tr> </tbody> </table></div> <h3> Escenario B </h3> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Beneficios totales</th> <th>Desarrollo web</th> <th>Resultado final</th> </tr> </thead> <tbody> <tr> <td>115.020,00€</td> <td>5.200€</td> <td><strong>109.820,00€</strong></td> </tr> </tbody> </table></div> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--YKR1iAPt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/sax5c03pam2x64es91r6.jpg" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--YKR1iAPt--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/sax5c03pam2x64es91r6.jpg" alt="Alt text"></a></p> <blockquote> <p>Imagen de <a href="https://pixabay.com/es/users/StartupStockPhotos-690514/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=593313">StartupStockPhotos</a> en <a href="https://pixabay.com/es/?utm_source=link-attribution&amp;utm_medium=referral&amp;utm_campaign=image&amp;utm_content=593313">Pixabay</a></p> </blockquote> <p>Son más de 50.000€. ¿Has pensado lo que te cuesta ganar 50.000€ como para perderlos por una decisión equivocada?</p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--tamFW6nb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/oraazbu1i1pkrx778y30.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tamFW6nb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/oraazbu1i1pkrx778y30.png" alt="Alt Text"></a></p> <p>En este experimento no hemos tenido en cuenta el efecto que puede tener el hecho de contar con un diseñador profesional que cree tu propia imagen y se preocupe por la experiencia de usuario, en vez de usar una plantilla. Es un suma y sigue.</p> <p>Recuerda: <strong>Good enough makes you poor</strong></p> <p>Por suerte para ti, en <a href="https://nimbel.vercel.app/">Nimbel</a> somos expertos en webs, aplicaciones de alto rendimiento, aplicaciones móviles y en todo lo que la tecnología del software puede ofrecerte. <br> Contacta con nosotros y cuéntanos que quieres hacer y nosotros nos encargaremos de ofrecerte la solución que mejor encaje con tu proyecto. Tú éxito es nuestra misión.</p> spanish jamstack speed business rubenofen Fri, 21 Feb 2020 11:29:39 +0000 https://dev.to/rubenofen/react-create-app-devel-server-subdomain-https-3jn9 https://dev.to/rubenofen/react-create-app-devel-server-subdomain-https-3jn9 <p>Hello everyone,</p> <p>I'm trying to do a https request from a create-react-app to get a login cookie.<br> To do this I have to be in the same subdomain of these call, thus I have added to my .env file:</p> <p>.env<br> </p> <div class="highlight"><pre class="highlight plaintext"><code>HOST=local.www.subdomain.org </code></pre></div> <p>Due to the call is https I have changed my package.json (I have to work in windows 😥)</p> <p>package.json<br> </p> <div class="highlight"><pre class="highlight javascript"><code><span class="dl">"</span><span class="s2">start</span><span class="dl">"</span><span class="p">:</span> <span class="dl">"</span><span class="s2">set HTTPS=true&amp;&amp;react-scripts start</span><span class="dl">"</span><span class="p">,</span> </code></pre></div> <p><code>EDIT: If you add HTTPS=true in .env file it will work too</code></p> <p>If I call to <a href="https://localhost:3000">https://localhost:3000</a><br> It is givig me an error in console, but the app is working:<br> </p> <div class="highlight"><pre class="highlight plaintext"><code>webpackHotDevClient.js:60 WebSocket connection to 'ws://localhost:3000/sockjs-node' failed: Connection closed before receiving a handshake response ./node_modules/react-dev-utils/webpackHotDevClient.js @ webpackHotDevClient.js:60 __webpack_require__ @ bootstrap:785 fn @ bootstrap:150 1 @ index.js:3 __webpack_require__ @ bootstrap:785 checkDeferredModules @ bootstrap:45 webpackJsonpCallback @ bootstrap:32 (anonymous) @ main.chunk.js:1 </code></pre></div> <p>When I try to call <a href="https://local.www.subdomain.org:3000">https://local.www.subdomain.org:3000</a></p> <p>It is givign mi an error but the app is not launched:<br> </p> <div class="highlight"><pre class="highlight plaintext"><code>SecurityError: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS. </code></pre></div> <p>Someone knows what is the reason for this error.</p> <p>Thank you </p> <p><code>EDIT: I found the solution of that in https://github.com/facebook/create-react-app/pull/8079#issuecomment-562373869. The reason is because in react-scripts if https protocol is being used we should use WebSockets over SSL/TLS (WSS) protocol instead of WebSockets (WS) To solve you have to update the react-script version from 3.3.0 to 3.x.x or do a downgrade to 3.2.0.</code></p> react security javascript