Eliminar SDKs de JAVA de MacOS
You can get official oracle instruction to remove java from macOS here In your macOS terminal type this one by one sudo rm -fr /Library/Internet\ Plug-Ins/JavaAppletPlugin.plugin sudo rm -fr /Library/PreferencePanes/JavaControlPanel.pref ...
Primers passos amb Canvas
Recentment he comneçat a experimentar amb Canvas, un integrant de HTML5 i JavaScript capaç de crear gràfics generats amb JavaScript. Aquests són els primers experiments.
Aprenc a crear plugins de WordPress
He començat a aprendrea a crear plugins per WordPress, després d'usar-ne durant anys. En aquest post deixo els enllaços a tutorials que he visionat. https://www.youtube.com/watch?v=vL_g4QV0-I4&list=WL&index=9 https://www.youtube.com/wat ...
3r projecte amb three.js :: my-first-universe
.entry-media { display: none!important; } https://eduvallve.com/wp-content/uploads/2021/07/003_PORTFOLIO_3D-VIDEO.webm Continuant amb l'aprenentatge en three.js, he seguit el tutorial de https://www.youtube.com/watch?v=Q7AOvWpIVHU&list=WL ...
Interaccions flotants amb JavaScript vanilla
En el tutorial https://www.youtube.com/watch?v=XK7T3mY1V-w&list=WL&index=3 l'autor explica com elabora. el mateial que podem trobar al seu repositori de GitHub: https://github.com/developedbyed/3d-card-effect És clarificador per aprendre a j ...
2n projecte amb three.js :: floating-cubes
Continuant amb l'aprenentatge en three.js, he finalitzat el tutorial de https://www.youtube.com/watch?v=6oFvqLfRnsU&list=WL&index=7 creant un entorn 3D on es generen cubs en posicions aleatòries i efectuen moviments en el moment de passar-los ...
1r projecte amb three.js :: floating-cube
Per fi començo a treballar en entorns virtuals generats en motors de render per a navegadors com és webGL. Ho he fet amb JavaScript i Three.js. Seguint aquest tutorial per persones absolutament novelles (https://www.youtube.com/watch?v=6oFvqLfRnsU&a ...
Xtensio i els User Persona
Amb Xtensio es poden crear el que ells en diuen Folios. També es poden crear de manera àgil eines com per exemple, User Personas. He explorat per sobre les seves possibilitats i, tot i que cal pagar una llicència per aprofitar-les totes, m'ha alleugr ...
Creadors de mockups!
Si mai necessiteu exhibir un mockup, he trobat diverses ebs que ofereixen gratuitament fons per a mockups. Algunes, són compatibles amb Figma també. Les llisto a continuació: https://mockuuups.studio/ https://www.ls.graphics/free-mockups https:/ ...
User Interface Design Patterns
El portal que resumeix i classifica els patrons de disseny d'interfícies més ocorrents i que defineix, per tant, elements estructurals que els dissenyadors de UI, GUI i UX poden tenir en compte en les seves propostes. Alhora, aquests patrons estable ...
Alvaro Trigo i el seu treball en .js
Alvaro Trigo és un desenvolupador que treballa sobretot en el camp de JavaScript. L'he descobert a través d'un post de Instagram, però resulta ser un entès en el tema. Té a Github, i de manera pública, repositoris amb plugins lliures per crear anima ...
The Bézier Game
The Bézier Game és una web dedicada a una única finalitat: ensenyar als usuari de programes de tractament d'imatge i imatges vectorials a dominar l'eina de la "ploma". A través del seu tutorial i els exercicis que proposa, fa que l'alumne practi ...
Emojis en HTML
L'emoticona 😀 està generada usant el codi HTML següent: <p>😀</p> D'aquesta manera, es poden crear emoticones de manera nativa en HTML com les de la imatge següent: Emojis en HTML Font: https://www.instagram.com/p/CQhiFQ ...
Etiquetes INPUT per a formularis en HTML que no coneixia
<input type="search" id="search" name="search"> <input type="email" id="email" name="email"> <input type="url" id="url" name="url"><input type="reset"> <input type="range" name="price" min="1000" max="10000" value="7500">< ...
Dues webs que tot programador necessita conèixer: DevDocs i Hacker News
DevDocs és un portal on es resumeix la documentació de les tecnologies i softwares més utilitzats. https://devdocs.io/ Hacker News conté notícies per estar al dia dels avenços en el món informàtic. https://news.ycombinator.com/
Redireccions casolanes post-formulari de contacte (Contact Form 7 a WordPress)
Deixo aquí un breu fragment de codi HTML i JS + jQuery dedicat a redirigir l'usuari a una pàgina d'agraïment un cop ha enviat un formulari de contacte usant Contact Form 7 (el plugin de WordPress per aquest fi per antonomàsia). En primer lloc, ca ...
JCH Optimize Plugin – Un salvavides per al SEO en WordPress
JCH Optimize Plugin és un plugin per Wordpress. La seva funció és oferir facilitats per optimitzar la web pel que fa a velocitat de càrrega. Per això, integra opcions de caché i alleugeriment de scripts CSS i JS entre altres avantatges. Després d ...
Anàlisi de sentiments
Com es sent la població en general envers un concepte? Aquesta pregunta és important per al desenvolupament d'intel·ligència artificial i també per a interfícies de veu o VUI (Voice User Interfaces). Saber el grau de plaer que connota un concepte ...
User flows (i altres diagrames), molt àgils amb App.Diagrams.Net
És increïble l'agilitat que proporciona https://app.diagrams.net/. L'aplicatiu web té un disseny semblant al que ofereixen els diferents productes d'ofimàtica en línia de Google Drive, però amb una implementació totalment dedicada a la diagramació. ...
Rive.app – Molt atractiu!
Rive.app és un editor d'animacions en 2D pensat per crear animacions enriquides per webs i aplicacions mòbils, i és hàbil per treball col·laboratiu. La millor part és que té una tarifa a cost zero, pensada er usuaris individuls que no necessiten edi ...
Introdueix-te a la Realitat Augmentada amb Spark AR
Facebook Inc. té a disposició del públic el software Spark AR, dissenyat per facilitar les feines d'edició d'elements de realitat augmentada. Hi farem una bona ullada! https://sparkar.facebook.com/ar-studio/
Agències web i audiovisuals que són una autèntica passada!
http://minimalheroes.tv/ https://tiltbuilt.com/
Portals interessants de disseny!
Llisto a continuació potals d'internet que representen, per mi, una inspiració en el moment de disenyar interfícies gràfiques: https://graffica.info/ https://www.verkami.com/ https://graphicburger.com/
Formació GRATIS en línia per a desenvolupadors!
En aquesta esntrada pretenc llistar les adreces web que he anat recopilant i usant per aprendre al llarg dels anys, i que seguiré utilitzant, de ben segur, els temps que vindràn. Soc fan de la formació en línia i de quaitat. Tanmateix, quan soc n ...
Fotografia “a full”
Els meus coneixements de fotografia son molt escassos. Tot i això, m'encanta aprendre el que aquest camp em pot oferir. Mica en mica vaig llegint sobre el tema i descobreifo portals especialitzats. En deixo per aqui... https://www.xatakafoto.com/ ...
EasyBacklog, ideal per SCRUM
SCRUM és una metodologia àgil de treball, mundialment coneguda i emprada per equips de desenvolupament en la que un "director" de projecte, anomenat "SCRUM Master", dirigeix l'activitat de l'equip de treball dins de periodes breus i de manera cíclic ...
Desactivar notificacions d’actualització de “plugins” i “themes” de WordPress
Molt útil quan saps que una actualització et tirarà enlaire hores o dies de feina. // Introdueix a l'arxiu funcions.php del teu "theme" els fragments de codi següents // Deshabilita les notificacions d'actualització per plugins function disable ...
ThreeJS – animacions i 3D per a la web!
Una de les meves passions és l'animació. Una altra, internet i les pàgines web. Sempre he volgut saber com es creen les pàgines que es veuren recollides a https://www.awwwards.com, per exemple. Un primer pas és entendre què ens ofereix ThreeJS, ...
Nova entrada del blog de l’Edu! Entra AQUI!
Nova entrada de blog després d'habilitar la web com a Progressive Web App!!
app.markup.io
Col·locar notes sobre les mateixes pàgines webs per contrastar opinions entre col·laboradors. https://app.markup.io/
Lucidchart (mapes conceptuals i diagrames)
Lucidchart és una eina amb versió gratuïta per fer diagrames amb múltiples aplicacions pràctiues. Jo ho he utilitzat amb la UOC per fer mapes conceptuals. https://www.lucidchart.com/pages/es i a més a més... Cognitive Maps, Mind Maps, and C ...
CORS Problem a causa de webfonts
<IfModule mod_headers.c> <FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$"> Header set Access-Control-Allow-Origin "*" </FilesMatch> </IfModule> Si apareixen errors CORS a la consola de javascript deguts a la càrre ...
Tests de guerrilla
https://medium.com/@trezecreativo/c%C3%B3mo-elaborar-un-test-de-usuario-de-guerrilla-1e36b8deb259
GUIES per planificar diferents estratègies de UX · Gentilesa de la UOC
https://aprenentatge.recursos.uoc.edu/design_toolkit/ca/guies.html
Error WordPress
M'he trobat amb l'error de consola de JS següent: 'Uncaught Reference Error:’ ‘wpColorPickerL1On is not defined' L'error m'impedia personalitzar el layout de la plantilla Publisher (de BetterStudio). He trobat la solució en aquest fòrum de ...
history.pushState()
Manipular com es visualitzen les URLs d'una web canviant la part posterior al domini es pot fer de manera fàcil i ràpida amb aquesta funció de Javascript: history.pushState(). Bàsicament, la funció afegeix un nou ítem a l'historial del navegador ...
La uniwebsidad
Falta que ho investigui a fons, però si el que hi he trobat és el que sembla, tenim cursos gratuïts i molt ben explicats, a l'estil de les universitats on-line, sobre: BootstrapSassHTMLCSSReferencia CSSSymfonyPythonRuby on RailsJavaScriptAjax ...
Scope Canvas, el punt de partida de la metodologia Lean UX
Super important fer una ullada a aquests continguts! https://trespuntoscomunicacion.es/tipsuxui/scope-canvas-el-punto-de-partida-de-lean-ux/ Exemple de model Canvas buit!Baixa'l ARA
Traduïr automàticament un lloc WordPress amb Google Translate
Aquí tenim la guia explicativa de com fer-ho: https://translatepress.com/automatically-translate-woocommerce/ Necessitarem un compte a Google Cloud Platform amb dades de facturació vinculades i ens caldrà instal·lar al nostre WordPress el plugin ...
Just Free Themes
Una petita mina d'or per temes i plantilles de WordPress. https://justfreethemes.com/
Superposicions en HTML
/** * Detects if two elements are colliding * * Credit goes to BC on Stack Overflow, cleaned up a little bit * * @link http://stackoverflow.com/questions/5419134/how-to-detect-if-two-divs-touch-with-jquery * @param $div1 * @param $div2 * @re ...
Error 404 WordPress poc comú
Fa uns dies em vaig trobar amb una situació inesperada que em va preocupar durant hores durant la instal·lació d'un WordPress. Havia creat el domini i el hosting, i havia pujat via FTP els fitxers del nucli de WordPress i els del Tema que havia escol ...
NinjaSEO, un mantra clar en qüestions de SEO
Si bé al post on comentava 40deFiebre us deia, pràcticament, que és la Bíblia del SEO a Espanya, afirmo que NinjaSEO és un mantra; una guia per seguir la direcció correcta en el món del posicionament per buscadors d'internet, sobretot quan ens estem ...
Dos programes de monitoreig remot!
Jo coneixia TeamViewer des de fa anys. TeamViewer és un software pensat per monitorejar un ordinador remot en cas de necessitat, habitualment per resoldre una incidència tècnica o fer una comprovació. TeamViewer és molt versàtil i està disponible per ...
40defiebre, un “must” de la mà de SocialMood
Em declaro FAN de SocialMood i de 40deFiebre, el seu blog de SEO i xarxes socials. Si sou coneixedors del "mundillu" sabreu que l'empresa madrilenya és un dels referents l'estat espanyol dins el Search Engine Optimization i les publicacions que fan a ...
Facebook Pixel
Facebook Pixel monitoreja la teva web i registra les accions dels usuaris de manera que Facebook pugui segmentar encara millor el públic objectiu dels anuncis de pagament o Facebook Ads ( https://blog.hootsuite.com/es/que-es-el-pixel-de-facebook/)JTN ...
Google Accelerated Mobile Pages
https://www.hostinger.es/tutoriales/como-configurar-amp-wordpress/
Limitar la cahcé d’Autoptimize · WordPress
# Limpia automáticamente la caché de Autoptimize si va por encima de 1024MB if (class_exists('autoptimizeCache')) { $myMaxSize = 1024000; # Puedes cambiar este valor a uno más bajo como 100000 para 100MB si tienes poco espacio en el servidor ...
Afegir el feed d’IG a la web personal
https://agostudio.es/como-obtener-iduser-y-token-de-instagram-tutorial/ ACTUALITZACIÓ El dia 29/06/2020 Facebook va inhabilitar els scripts de tercers com InstaFeed i des de llavors obliga a fer servir la propia API de Facebook per importar el ...
JSONPlaceholder
Recentment he ampliat coneixements de JavaScript cap al domini de frameworks que ens fan la vida de programador una mica més útil. Durant un curs de AngularJS, he descobert una plataforma anomenada JSONPlaceholder, que compta amb una API pròpia crea ...
Resolucions de monitor més habituals actualment
Juan Diego de Usera resumia en un article del portal HardZone (03.03.2018) les diverses resolucions de pantalla de monitors al llarg de la història i en funció del dispositiu. En aquesta publicació faig córrer aquesta llista, ja que m'ha anat molt b ...
Cloud Convert. S’han acabat les incompatibilitats
Habitualment treballo en entorns Windows i Macintosh i sovint hi ha extensions de fitxers incompatibles d'un Sistema Operatiu a l'altre. Això és així perquè tant Microsoft com Apple desenvolupen el programari específic pel seu propi S.O. Afor ...
Webtraining.zone, una escola de programació recomanada
Webtraining és una escola de programació web en línia que té contingut molt interessant en CMS i frameworks diversos.
Baixa’t el feed d’IG al teu PC
Com recuperem aquella imatge del nostre feed d'Instagram que ens agrada i que no tenim enlloc més? Existeixen còpies de seguretat a IG? Les imatges són descarregables? La resposta a aquestes preguntes es SÍ. Es poden baixar de cop totes les i ...
“loaders.css”; pràctics i originals
Ja sigui per estètica, per amanitzar una càrrega forçosament lenta o per trencar el gel d'una manera diferent, a vegades les webs incorporen "animacions pre-càrrega" (o preloaders, en anglès) que fan que aquells 3 segons abans no es mostra el conting ...
La practicitat de “.isInViewport()” jQuery
En aquesta ocasió parlaré d'un fragment de jQuery que m'ha facilitat la feina d'optimitzar la càrrega d'una pàgina plena d'elements <iframe>. La pàgina, dissenyada amb una navegació vertical, requeria carregar iframes a mesura que es navega ca ...
Anàlisi de seguretat
Totes les pàgines webs requereixen un mínim manteniment per assegurar que es troben en òptimes condicions. Recentment he dut a terme exàmens de seguretat i tasques de protecció de la informació d'una web que presentava errors de seguretat i arxius ma ...
Llibreries d’icones
Les icones són elements indispensables en tots els projectes interactius. Aporten beneficis variats: Faciliten la comprensió. Milloren la usabilitat de la plataforma. Fan més agradable i neta la interfície (UI). Beneficien la experiència de ...
Com interactuar amb la base de dades de WordPress
Quan es comença en el món del WordPress, sembla que els límits de la creativitat siguin les funcionalitats pre-establertes que ofereix el Sistema de Gestió de Continguts o els Temes que utilitzem. A mesura que hi treballem, anem descobrint que no és ...
Nou apartat de Gadgets! + Pocket Tripod PRO
Una de les coses que més m'entusiasma del món digital són els gadgets que surten al mercat dedicats a les aplicacions quotidianes. Avui que és diumenge enceto un nou apartat del blog dedicat als gadgets que trobo per internet i xarxes socials, que se ...
PHPMailer, la forma depurada d’enviar emails
PHP sempre ha portat integrada la funció mail(), que permet enviar de forma Exemple:FONT: https://www.w3schools.com/php/func_mail_mail.asp És una funció senzilla i àgil. Tot i això, mail() no permet especificar informació del servidor SMTP, mostrar e ...
Avui descobrim… SiteInspire.com
Són molts els professionals que treballen en el disseny de pàgines web intuïtives, funcionals i, sobretot, atractives. En aquest post vull mostrar una web on es recullen moltes d'aquestes webs trascendents que fan que el disseny interactiu sigui moti ...
Can I use…
Recentment he descobert la web caniuse.com, on s'especifica l'estat de les tecnologies web existents i el seu nivell de suport i acceptació en els diferents navegadors. En aquest portal, que probablement molta gent ja coneix, ajuda a valorar i decidi ...
jQuery.ajax()
Sóc molt fan de la tecnologia Ajax, i el que permet aconseguir. Sovint utilitzo un petit fragment de jQuery que es comunica en segon pla amb un arxiu .php. Així s'aconsegueixen accions dins el servidor i/o la base de dades MySQL sense necessitat de r ...
Centrar horitzontal i verticalment en CSS
A vegades pot fer falta centrar un element multimèdia al centre de la pantalla, i fer que aquest element es vegi sempre sencer en tots els dispositius. Per fer-ho, es pot utilitzar el fragment de codi adjunt. <div class="container"> <div c ...
Sitemaps WordPress + Google Search Console
Quan volem que una web es posicioni, cal tenir en compte l'activitat que s'hi fa, la freqüència en que s'actualitza el contingut i se n'afegeix de nou, la quantitat d'imatges, les metadades, les paraules clau... etc. Són molts els elements que s'han ...
Webview bàsic amb Xcode 10.0
Un projecte de l'estudi consistia en una pàgina web pensada pel registre de dades d'activitat dels usuaris que l'utilitzéssin. A més, comptava amb un Webview per Android i un Webview per iOS. En una altra entrada explicaré com crear un perfil de des ...
Forçar SSL amb .htaccess
Sovint em trobo amb la necessitat d'actualitzar pàgines web i aplicar-los seguretat. Per això, un pas essencial és activar i forçar l'ús del certificat SSL. Una opció universal i senzilla de forçar-lo és modificant (o creant, si encara no existeix di ...
WordPress multiidioma (sense plugins)
A l'estudi em van passar un projecte en Wordpress començat, que faltava acabar. Concretament, calia aplicar traduccions a la web per fer-la multiidioma. El primer que vaig pensar va ser utilitzar Polylang (un plugin de Wordpress gratuït enfocat a ge ...
getCookie()
function getCookie(cname) { var name = cname + "="; var decodedCookie = decodeURIComponent(document.cookie); var ca = decodedCookie.split(';'); for(var i = 0; i <ca.length; i++) { var c = ca; while (c.charAt(0) == ' ') { c = ...