Low code
The following has evaluated to null or missing:
==> mostrarTituloH2 [in template "20102#20129#105831" at line 4, column 40]
----
Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: #assign hayH2 = getterUtil.getBoolean... [in template "20102#20129#105831" at line 4, column 1]
----
1<#assign title = .vars['reserved-article-title'].getData()>
2<div class="containerInterior">
3<#assign hayH1 = getterUtil.getBoolean(MostrarTituloH1.getData())>
4<#assign hayH2 = getterUtil.getBoolean(mostrarTituloH2.getData())>
5
6<#if hayH1>
7 <h1 aria-level="1" role="heading" id="titulo">${layout.getName(locale)}</h1>
8</#if>
9<#if hayH2>
10
11 <#if TituloContenido.getData()?? && TituloContenido.getData() != "">
12 <#assign contenido = TituloContenido.getData()>
13 <#else>
14 <#assign contenido = title>
15 </#if>
16
17 <#if hayH1>
18 <p id="subtitulo"
19 aria-level="2"
20 role="heading"
21 style="
22 color: #007f33 !important;
23 font-size: 45px;
24 font-family: 'IberPangea Medium', sans-serif;
25 line-height: 45px;
26 margin-top: .75em;
27 margin-bottom: .9em;">
28 ${contenido}
29 </p>
30 <#else>
31 <p id="subtitulo"
32 style="
33 color: #007f33 !important;
34 font-size: 45px;
35 font-family: 'IberPangea Medium', sans-serif;
36 line-height: 45px;
37 margin-top: .75em;
38 margin-bottom: .9em;">
39 ${contenido}
40 </p>
41 </#if>
42
43</#if>
44
45<#if getterUtil.getBoolean(MostrarCategorias.getData())>
46
47
48
49 <#assign journalArticleId = .vars['reserved-article-id'].data>
50 <#assign journalArticleLocalService = serviceLocator.findService("com.liferay.journal.service.JournalArticleLocalService")>
51
52 <#assign assetCategoryPropertyLocalService = serviceLocator.findService("com.liferay.asset.category.property.service.AssetCategoryPropertyLocalService") />
53
54 <#assign article = journalArticleLocalService.getArticle(groupId, .vars['reserved-article-id'].data) />
55 <#assign assetEntryLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetEntryLocalService")>
56 <#assign asset = assetEntryLocalService.getEntry('com.liferay.journal.model.JournalArticle', article.resourcePrimKey) >
57 <#assign layoutLocalService = serviceLocator.findService("com.liferay.portal.kernel.service.LayoutLocalService") />
58
59 <p class="tag-categorias">
60
61 <#list asset.getCategories() as category>
62
63
64
65 <#if assetCategoryPropertyLocalService.fetchCategoryProperty(category.getCategoryId(), "friendlyURL")??>
66
67 <#assign categoryFriendly = '/tag/' + assetCategoryPropertyLocalService.fetchCategoryProperty(category.getCategoryId(), "friendlyURL").getValue() />
68
69 <#if layoutLocalService.fetchLayoutByFriendlyURL(groupId, false, categoryFriendly)??>
70 <#assign categoryLayout = layoutLocalService.fetchLayoutByFriendlyURL(groupId, false, categoryFriendly) />
71 <#assign categoryLayoutURL = portalUtil.getLayoutFullURL(categoryLayout, themeDisplay) />
72
73 <a class="tag-categoria" href="${categoryLayoutURL}">${category.getTitle(locale)?cap_first}</a>
74
75 <#else>
76 <a class="tag-categoria" href="/tag/#">${category.getTitle(locale)?cap_first}</a>
77
78 </#if>
79 </#if>
80
81
82
83
84 </#list>
85
86 </p>
87
88</#if>
89<div id="contenidoEntradilla">${DescripcionDetalleContenido.getData()}</div>
90
91
92<#if ContenidoWebcofl.getSiblings()?has_content>
93 <#list ContenidoWebcofl.getSiblings() as cur_ContenidoWebcofl>
94 <#assign
95 webContentData = jsonFactoryUtil.createJSONObject(cur_ContenidoWebcofl.getData())
96 />
97
98 <#if webContentData?length gt 5>
99 <@liferay_asset["asset-display"]
100 className = webContentData.className
101 classPK = webContentData.classPK?number
102 />
103
104 </#if>
105
106
107 </#list>
108</#if>
109</div>
110<@liferay_util["html-top"]>
111<style>
112 #decPagination div.containerInterior p#subtitulo {
113 font-family: "Iberpangea Medium";
114 font-size: 45px;
115 line-height: 45px;
116 color: #007F33;
117 margin-bottom: 20px;
118 }
119
120
121 div.contenidoCentrado div.contenidoInterior div.containerInterior p.tag-categorias a.tag-categoria:focus{
122 outline: 2px solid rgba(0, 0, 0, 0.7) !important;
123 }
124 p.tag-categorias > .tag-categoria {
125 width: auto !important;
126 max-width: inherit !important;
127 }
128
129 div.faldon h2 {
130 width: 100%;
131 float: left;
132 font-size: 1.26em;
133 font-family: IberPangeaText Light, sans-serif;
134 margin-bottom: 2em;
135 border-bottom: 1px solid #e0e0e0;
136 padding-bottom: .8em;
137 color: #427314 !important;
138
139 line-height: 1.35em;
140 margin-top: .75em;
141 }
142 .contenidoInterior div.faldon h2+ul li:before {
143 margin: .15em 0 0 -1.75em;
144 font-size: 1em;
145 }
146 .cursiva_texto {
147 font-style: italic;
148 }
149 .contenidoInterior h1 {
150 font-family: 'IberPangea', sans-serif !important;
151 font-size: 32px !important;
152 border: none !important;
153 line-height: 36px !important;
154 letter-spacing: 0px !important;
155 color: #00402A !important;
156 padding-left: 0em !important;
157 margin-bottom: 14px !important;
158 }
159 p span.table a.enlace-actualidad[href*="/tag/"],
160 p span.table a.enlace-actualidad[href*="/label/"],
161 p.tag-categorias a.tag-categoria[href*="/tag/"],
162 p.tag-categorias a.tag-categoria[href*="/label/"]{
163 line-height: 23px !important;
164 }
165 .contenidoInterior #contenidoEntradilla p.entradilla {
166 font-family: IberPangeaText, sans-serif !important;
167 font-size: 17px !important;
168 line-height: 23px !important;
169 font-weight: 700;
170 color: #615D5A !important;
171 margin-top: 2em;
172 }
173
174 .contenidoInterior h2#subtitulo{
175 font-family: 'IberPangea Medium', sans-serif !important;
176 margin-bottom: 0.4em;
177 }
178 #decPagination div.containerInterior{
179 max-width:980px;
180 margin:0 auto 25px;
181 }
182 #decPagination div.containerInterior h1#titulo{
183 font-family:"Iberpangea Medium";
184 font-size:32px;
185 line-height:36px;
186 color:#00402A;
187 text-transform:none;
188 border-left:none;
189 margin-top:20px;
190 }
191 #decPagination div.containerInterior h2#subtitulo{
192 font-family:"Iberpangea Medium";
193 font-size:45px;
194 line-height:45px;
195 color:#007F33;
196 margin-bottom:20px;
197 }
198 #decPagination div.containerInterior p.tag-categorias{
199 margin-bottom:30px !important;
200 }
201 #decPagination div.containerInterior p.tag-categorias a.tag-categoria{
202 margin-right:20px;
203 color:#00402A;
204 }
205 #decPagination div.containerInterior div#contenidoEntradilla p.entradilla{
206 font-family:"IberpangeaText";
207 font-size:20px ;
208 line-height:26px;
209 color:#615D5A;
210 }
211 @media all and (max-width:500px){
212 #decPagination div.containerInterior h1#titulo{
213 font-size:26px;
214 line-height:36px;
215 }
216 #decPagination div.containerInterior h2#subtitulo{
217 font-size:35px;
218 line-height:35px;
219 margin-bottom:20px;
220 }
221 #decPagination div.containerInterior div#contenidoEntradilla p.entradilla{
222 font-family:"IberpangeaText Bold";
223 font-size:16px ;
224 line-height:24px;
225 }
226 }
227 @media screen and (max-width: 47.95em) {
228 .contenidoInterior h1 {
229 font-size: 26px !important;
230 }
231 .contenidoInterior h2#subtitulo{
232 font-size: 35px;
233 line-height: 35px;
234 color: #007F33 !important;
235 margin-bottom: 1em;
236 }
237 .contenidoInterior #contenidoEntradilla p.entradilla {
238 margin-top: 0.8em;
239 }
240 .contenidoInterior #contenidoEntradilla p.entradilla {
241 line-height: 24px !important;
242 }
243 }
244
245
246</style>
247</@>
Desde hace casi dos décadas que plataformas como Wordpress permiten a cualquier persona abrirse un blog o una página web sin tener conocimientos de programación de ningún tipo. Herramientas de código abierto que iniciaron el camino para hacer el diseño web más accesible al usuario medio. En una sociedad con una actividad digital cada vez más intensa y una dependencia mayor de las aplicaciones móviles, el low code ha supuesto un paso adelante sin retorno en este sentido. El desarrollo de “código bajo” y la programación sin código resuelven la necesidad de cantidad de ciudadanos, empresarios y empleados de colocar contenido propio en distintos entornos de forma autónoma y sin que les suponga una enorme inversión de tiempo y dinero.
¿Qué es low code?
El concepto low code fue acuñado en torno a 2014 por la agencia de investigación de mercados Forrester Research en un informe sobre nuevas plataformas de desarrollo de aplicaciones orientadas al usuario. El desarrollo sin código surgía con fuerza ante la progresiva simplificación de las herramientas tecnológicas, la demanda de soluciones web cada vez más baratas y la escasa oferta de programadores cualificados con las competencias digitales específicas.
El low code permite a los usuarios crear, desarrollar y mantener aplicaciones en los más variados dispositivos y medios digitales, de la forma más eficiente que existe: automáticamente. La mayoría de estas herramientas “no code” son plataformas en línea, de manera que ni siquiera es necesario instalar ningún programa en nuestros dispositivos para utilizarlas, basta con acceder desde un navegador web. Además, el low code permite una actualización constante de la aplicación, a efectos de satisfacer las demandas cambiantes de los consumidores.
Por lo general, se trata de interfaces muy visuales y muy intuitivas. Se basan en un principio modular en el que se pueden arrastrar estructuras enteras con el ratón —el denominado “drag and drop”— y con una serie de componentes ya creados en forma de plantillas. Esto facilita la construcción de flujos de información, la presentación de datos de forma vistosa o la automatización de acciones.
Ventajas y beneficios del low code
Si bien la computación tradicional es y va a seguir siendo imprescindible para la transformación digital y el progreso económico y social a nivel global, el progresivo acceso al desarrollo para usuarios no especializados a través del low code tiene infinidad de ventajas y beneficios. A pesar de ofrecer un nivel de personalización y flexibilidad limitados, estas herramientas democratizan la informática y cuentan con un punto positivo extra como es acercar la Inteligencia Artificial a más personas.
Agilidad
Gracias a las low/no code el tiempo para poder sacar al mercado productos web pequeños y medianos se reduce enormemente. Al ahorrar toda la parte de desarrollo de código, en algunas plataformas como Shopify, por ejemplo, se pueden ahorrar días completos de trabajo y desarrollar un e-commerce en menos de una semana. Igualmente, los tiempos de mantenimiento y actualización de las aplicaciones también disminuyen.
Autonomía
Un beneficio clave utilizando estas plataformas es que los usuarios no requieren de un experto informático o programador para sacar adelante un producto de calidad. El low code abarca funcionalidades y modelos predefinidos y estandarizados que antes requerían de la intervención del personal de desarrollo, lo que aporta autonomía al usuario y tiempo a los desarrolladores para enfocarse en otras tareas como potenciar el software o idear nuevas soluciones web.
Ahorro
Debido a la independencia de los expertos de desarrollo web, trabajar con herramientas de low code y no code supone una inversión inicial mínima en configuración, capacitación e implementación. Existen diferentes tarifas para la utilización de estas plataformas online en función de la necesidad y del volumen de datos e información que solicite cada cliente, pero muchas ofrecen un periodo de prueba sin coste e incluso un plan básico gratuito.
Colaboración
La accesibilidad de las plataformas low code para el personal de cualquier departamento de una empresa facilita la participación de todos ellos en la creación de una aplicación web que cubra las necesidades de todos. Estas herramientas suponen así mejoras contundentes a nivel de la colaboración, la agilidad y la productividad de los equipos, preferiblemente siempre guiados o apoyados por profesionales de programación “tradicional".
Low-Code vs Traditional Coding, ¿en qué se diferencian?
Herramientas requeridas 
Coste 
Rapidez 
Despliegue 
Alcance 
Herramientas requeridas 
Coste 
Rapidez 
Despliegue 
Alcance 
VER INFOGRAFÍA: Diferencias entre programación tradicional vs low code [PDF]
Diferencias entre low code y no code
Las plataformas de low code y no code tienen una filosofía común: reducir el código ad hoc para hacer la programación más accesible. Sin embargo, según la opción que elijamos, el margen de personalización, complejidad y autonomía a la hora de desarrollar una aplicación varía.
No code:
Son plataformas pensadas para usuarios que no tienen ningún conocimiento de programación, de manera que no requieren nada de código. Son útiles para crear aplicaciones con un tiempo de vida corto, en casos de negocio simples o procesos manuales que no requieran conexiones a sistemas de terceros, entre otros.
Low code:
Son plataformas con un contenido bajo en código, que con unas nociones muy básicas de programación manual permiten cierta personalización de las funcionalidades, los modelos y las plantillas preconfiguradas que ofrece la herramienta. Se utilizan para generar aplicaciones con un ciclo de vida mayor, soluciones que se tengan que integrar con sistemas corporativos más complejos o la creación Productos Mínimos Viables (MVP), por ejemplo.
Plataformas low code más conocidas
Destacamos cinco plataformas low code que pueden facilitar la transformación digital de cualquier organización al ofrecer una suerte de DIY (Do It Yourself) para programar sin código soluciones y aplicaciones web.
-
Wordpress. Nacida en 2003 es un sistema de gestión de contenidos que alcanzó gran popularidad en la creación de blogs, para luego convertirse en una de las principales herramientas para la creación de páginas web comerciales. Según datos de Simplifier, una de cada 3 webs se gestiona en la actualidad a través de Wordpress.
-
Honeycode. Amazon lanzó su propia plataforma los code en 2020, donde se pueden diseñar y construir aplicaciones de hasta 20 usuarios de manera gratuita a partir del ensamblaje de módulos de diversos tipos.
-
Appsheet. Google proporciona esta plataforma de desarrollo sin código para software de aplicación, que permite a los usuarios crear aplicaciones móviles, tabletas y web utilizando fuentes de datos como Google Drive, DropBox, Office 365 y otras plataformas basadas en la nube.
-
PowerApps. Microsoft ha creado un entorno de desarrollo para crear de forma ágil aplicaciones empresariales adaptadas a las necesidades de cada organización. Con Power Apps pueden crearse aplicaciones que se conecten a los datos de un negocio almacenados en la plataforma de datos subyacentes (Microsoft Dataverse) o en varios orígenes de datos locales y en línea.
-
Figma. En 2015 esta start-up quiso lanzar la primera herramienta de diseño que combinase la accesibilidad de la web con la funcionalidad de una aplicación nativa. Una herramienta gratuita para que cualquier persona pueda comenzar y fomentar el trabajo colaborativo.