#java

Iván Sánchez Ortega / Leaflet.TileLayer.GL · GitLab
▻https://gitlab.com/IvanSanchez/Leaflet.TileLayer.GL

With this plugin, you can apply colour transforms to your tiles, merge two or more tiles with a custom function, perform on-the-fly hillshading, or create synthetic tile layers based only on the map coordinates.

See several examples and edit them :
▻http://ivansanchez.gitlab.io/Leaflet.TileLayer.GL/demo/repl.html

Why?

#Leaflet has been lagging behind when it comes to #WebGL technology. Other map libraries (such as OpenLayers 3 and most notably Tangram) can already use WebGL shaders to apply transformations to map tiles and do fancy stuff.

The inflexion point are MapBox’s “Terrain-RGB” tiles. WebGL manipulation of these tiles can provide real-time terrain relief and hill shading.

This takes some inspiration from shadertoy.com, in the sense that the shaders work on two triangles with some predefined attributes and uniforms.

#map

mermaid · GitBook
▻https://mermaidjs.github.io

Generation of diagrams and flowcharts from text in a similar manner as markdown.
Ever wanted to simplify documentation and avoid heavy tools like Visio when explaining your code?
This is why mermaid was born, a simple markdown-like script language for generating charts from text via javascript.

Un générateur (javascript) de diagrammes à partir de sources en markdown.
Basé sur le moteur de rendu de #3djs, utilise la syntaxe de js-sequence-diagram (▻https://bramp.github.io/js-sequence-diagrams)

A tester : l’éditeur en ligne ▻https://mermaidjs.github.io/mermaid-live-editor

Plusieurs éditeurs de code supportant le markdown proposent des plugins pour la prévisualisation (VS Code, Sublime text, VIm...).
Un plugin Gitlab permet d’afficher les schémas intégrés dans les fichiers .md (en particulier le Readme.md) : idéal pour des schémas intégrés à la documentation
(à intégrer dans le plugin markdown de SPIP ?)

#diagramme #javascript #markdown #gitlab #js-sequence-diagram #documentation

Serving #react and Koa together
▻https://hackernoon.com/serving-react-and-koa-together-720ba6668298?source=rss----3a8144eabfe3--

https://cdn-images-1.medium.com/max/1024/1*VtBDZQkGUYLdahqiNsGGLA.png

Reactjs and #koajs are two great frameworks of #javascript. I wonder how to serve React and Koa projects in the same server and same port! Finally, I’ve reached a solution and today I’ll discuss it.In this article, we’ll create an API using koa and a React project (frontend) which will consume the API. The idea is very simple, React will fetch some book names from the backend (koa) and render them.Backend (Koa) projectKoa uses async functions, this gives an advantage over callback functions. By default, Koa does not come with any middlewares. That makes Koa very minimal and elegant.At first, we need to install node (koa requires node v7.6.0 or higher). Then install koa using : npm i koaCreate a project directory named “book” and run npm init -y.As koa doesn’t come with any middlewares and we need (...)

#single-page-applications #nodejs

How I configure VSCode for Everything
▻https://hackernoon.com/how-i-configure-vscode-for-everything-7df65a316a52?source=rss----3a8144e

https://cdn-images-1.medium.com/max/1024/1*j-b1dZsAJGfhUEQVHu2Wpw.jpeg

Credits: Unsplash/Joshua AragonRecently, I was at the Boryspil Airport, Ukraine, working on a blog article when suddenly my VSCode stops working. It actually got crashed! Not once, but twice under 30 minutes. Some of the content was autosaved, some of it was gone forever…I was frustrated at first as to why it had to crash at that moment! Next, after re-opening the editor, I was angry with myself for I had to write some of the stuff again that didn’t get saved.Also, at times, previous this experience, it did feel that I have bloat of extensions that I am not using since I have stopped working with some of the frameworks in recent months (example, Angular).What did I do? After none of the emotions helped, I had to find a way to cope better. On a network that was not so crappy, but did have (...)

#react #programming #javascript #hackernoon-top-story #productivity

#javascript Array.reduce()
▻https://hackernoon.com/javascript-array-reduce-50403c421968?source=rss----3a8144eabfe3---4

https://cdn-images-1.medium.com/max/800/1*0Dqvmi5ib4OtO8gA24MTxQ.jpeg

How do I loathe thee? Let me count the ways…The Array.reduce() method has been around awhile. Like map(), filter() and find(), it operates upon an array of values by invoking a callback function.Here’s an example from the developer.mozilla.org site:const array1 = [1, 2, 3, 4];const reducer = (accumulator, currentValue) => accumulator + currentValue;// 1 + 2 + 3 + 4console.log(array1.reduce(reducer));// expected output: 10// 5 + 1 + 2 + 3 + 4console.log(array1.reduce(reducer, 5));// expected output: 15Seems straightforward, right? On with the grievances:0. It doesn’t do what you expectLet’s look at this again:const array1 = [1, 2, 3, 4];const reducer = (accumulator, currentValue) => accumulator + currentValue;// expected: 1 + 2 + 3 + 4 === 10Now I’ll modify the reducer function to add 1 (...)

#reduce

#performance Profiling During Your Development Workflow
▻https://hackernoon.com/performance-profiling-during-your-development-workflow-ebff78afb71c?sour

Ditch subjectivity about performance with #java VisualVMPerformance profiling isn’t just an activity reserved for Ops teams monitoring an application in production — in my view, it’s a skill that should become part of every decent software developer’s/engineer’s development workflow.It’s not just for troubleshooting, be proactive and take a look under the bonnet (hood* 🇺🇸) before the trouble even starts.I’m going to ask you 2 questions:Do you want to be the team member who committed the two lines of code that brought production to its knees and ground it to a halt?OR:Do you want to be the glorious team member who saved the team from merging the defective code in the first place?Unless you hate your team and your company, I’m pretty sure you want to be the latter team member — which is why I’ve put (...)

#software-development #programming #software-engineering

#es6 and Beyond >
▻https://hackernoon.com/es6-and-beyond-28aed8574e00?source=rss----3a8144eabfe3---4

https://cdn-images-1.medium.com/max/1024/1*YnFCu3IeIhmvPg3GCk769A.jpeg

Hello folks,ES6, pretty much hyped topic these days in front-end world.So, how about learning some cool features of ES6 and Beyond (like, #es7, ES8).First thing first.What ES means?ES stands for #ecmascript.What is the different between ECMAScript and JavaScript then?ECMAScript is the standard whereas #javascript is also the standard. But,ECMAScript is specification whereas JavaScript is the implementation of ECMAScript specifications.So, let’s get started.What we are going to learn?letconstObject Rest/Spread propertiesArrow FunctionString interpolationExponential **Array.prototype.includesString.prototype.padStartString.prototype.padEndObject.valuesObject.entriesLetlet is the new var but the advantage is that it is accessible & available within the scope only. Let’s see an  (...)

#es8

Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!
▻https://frontendmasters.com/books/front-end-handbook/2019

Building a Progressive Blog App with #apollo and Cosmic JS
▻https://hackernoon.com/building-a-progressive-blog-app-with-apollo-and-cosmic-js-aaaccd24966f?s

https://cdn-images-1.medium.com/max/527/1*IRdI9l980gmFfdkx7ai2hw.png

Hello stranger.Come with me on a short adventure as we build a fast, simple interface for publishing blog style articles. Something sensible. It should look clean and simple yet have the ability to perform powerful resource fetching with some query magic. I’m talking about #graphql, the query language built with web APIs in mind. And speaking of web APIs, we will also be using our handy Content Management Service: Cosmic JS, to Create and Store our Blog Data.TLDR:Progressive Apollo BlogProgressive Apollo Blog Codebase0.0 Before You StartBefore you go any further make sure you have the required developer tools installed on your machine. Mainly you will need Node JS, its accompanying package manager: npm, and git. Git is semi optional and will only be used to code storage and deployment if (...)

#react #cosmic-js #javascript

#angular Universal On Firebase Hosting: A Tutorial
▻https://hackernoon.com/angular-universal-on-firebase-hosting-a-tutorial-721f25eb13be?source=rss

https://cdn-images-1.medium.com/proxy/1*BZ1IMWrjdIGuQzcRXA5cDg.png

In this Angular Tutorial, I’ll tell you how you can make you a normal Angular app to support Server-side rendering using angular universal and deploy it on firebase hosting with firebase functionsI am assuming you already have an angular projectFirst, you have to Add angular universal support to your Angular application for that we will run one cmd Note you can find your project name in angular.json in your root folderOnce it is done you will see numerous changes in your project to know more about this transition visit Angular universal officialng add @nguniversal/express-engine —clientProject <project name>Next step is to make some changes in your server.ts 1. ) you need to add export in front of app variable2. ) You need to comment the listening of your app which is typically at (...)

#angular-tutorial #javascript #programming #typescript

Learn to code in 5 months, get hired, and thrive as a web developer
▻https://hackernoon.com/learn-to-code-in-5-months-get-hired-and-thrive-as-a-web-developer-5ab683

https://cdn-images-1.medium.com/max/750/1*FRSrcbGuLEXvvuzaxdmMeg.jpeg

Nowadays we can’t imagine our lives without websites and apps — they changed everything. And as web development continues to grow exponentially, there remains an immense demand for web developers that is projected to grow over a 10-year period.With a wide range of possible ways to become a web developer, most learners are not sure how to begin.In this article, you will find a step-by-step plan on how to become a web developer in 5 months. This article answers three main questions:Part 1: WHY learn to code?Part 2: WHAT you will learn? (the 5-month plan)Part 3: WHEN to start looking for a job?Part 1: WHY learn to code?You can improve your yearly incomeAccording to Paysa, a salary comparison website, “A Web Developer earns an average of $91,587, ranging from $77,544 to $103,370, with top earners (...)

#front-end-development #learn-to-code-online #javascript #learning-to-code #web-development

Playing Space Invaders With Your Own Voice
▻https://hackernoon.com/playing-space-invaders-with-your-own-voice-f0bc7581e9bc?source=rss----3a

https://cdn-images-1.medium.com/max/1024/1*nsJrdH3vdEAW-2vjzFR_dg.jpeg

Photo by Andre HunterAfter some time testing voice #games in my Alexa device, one question came to my mind…Why not try to convert a classic game control system to a Voice User Inteface?So let’s do a simple experiment with a Space Invaders written in #javascript.Final result (Kind of)After some walkarounds I made a requirement list in order to reach my target:Speech RecognitionSpeech SynthesisAn NLU or set of hardcode rules to match my utterances to intentsImplementation of the web reactions to these intentsWell, once I had more or less clear what I was looking for, I use the second engineer lesson: don’t reinvent the wheel. So, once again I whispered something to Google and it led me to something called Woice.Once I went through the tutorial for creating a new application, I charged the SDK (...)

#ai #voice-assistant #ux

Semantic Versioning 101
▻https://hackernoon.com/semantic-versioning-101-d2623083714b?source=rss----3a8144eabfe3---4

https://cdn-images-1.medium.com/max/1024/1*hghixiKhRY9DV49-mZQGmg.png

Semantic Versioning 2.0.0 (semver.org) is a robust and elementary standard that encapsulates a wealth of information about the software you’re publishing or consuming.Open source veterans know and understand the importance of this standard. If you’ve run a project in long-term maintenance mode, you come to realize its power one way or another. Still, enthusiastic, fast-moving dev teams like to find ways around this standard. I’ve seen more than a few engineers decide to invent their own ideas around major, minor, and patch increments. Their rationale is rooted in aesthetics or their own release schedule.A key principleAside from the concise and complete information at semver.org, it is critical to understand:Semantic versioning is for your consumers. It’s not for your release schedule or (...)

#python #nodejs #open-source #software-development #javascript

You-Dont-Need-jQuery/README-fr.md
▻https://github.com/nefe/You-Dont-Need-jQuery/blob/master/README-fr.md

Avoiding Race Conditions when Fetching Data with React Hooks
▻https://hackernoon.com/avoiding-race-conditions-when-fetching-data-with-react-hooks-220d6fd0f66

https://cdn-images-1.medium.com/max/1024/1*okLGlm1oBbTkR9OIm--MYA.jpeg

Man jumping over clockAbout a month ago, I posted an example of fetching data using React Hooks to Twitter. While it was well-intended, Dan Abromov (of the React core team) let me know that my implementation contained a race condition. Consequently, I promised to write a blog post correcting my implementation. This is that post!Note: If this article helps you, please help spread the word by lending a clap (or 50)! 👏👏SetupIn our example app, we are going to fake-load people’s profile data when their names are clicked. To help visualize the race condition, we’ll create a fakeFetchfunction that implements a random delay between 0 and 5 seconds.const fakeFetch = person => return new Promise(res => setTimeout(() => res($person's data), Math.random() * 5000); );;Initial (...)

#react-hook #reactjs #front-end-development #asynchronous #javascript

Guide to recover from accidental commits and rebase in #git
▻https://hackernoon.com/guide-to-recover-from-accidental-commits-and-rebase-in-git-d46cc0b54046?

https://cdn-images-1.medium.com/max/930/1*QqZwxKbSlsQBZl-AhICbBA.gif

REBASE can be HelpfulTraditional working of Git RebaseIn Git, the rebase command integrates changes from one branch into another. It is an alternative to the better known “merge” command.You heard it’s scary right? You can create or recreate HISTORY! 🌗People ask you to stay away from git rebase but, it can be very useful at times. This articles covers a good use of REBASE command contrary to the definition that is taken from the official git documentation.A good use of git REBASELet’s talk about a very common scenario which I think all developers may have encountered or will encounter one day.Suppose you are using the same machine for the company as well as for your personal projects and when you use two different accounts for your #github, you configure your local git like this:git config (...)

#developer #javascript #development

The 2019 Web Developer RoadMap
▻https://hackernoon.com/the-2019-web-developer-roadmap-ab89ac3c380e?source=rss----3a8144eabfe3--

https://cdn-images-1.medium.com/max/866/1*xksUCqVg5XSP_RSyIaL2-g.png

An illustrated guide to becoming a Web Developer with links to relevant coursesHello Guys, I hope you are doing great in 2019. I am sure you all have already made your goals by now and thinking about how to achieve those goals. If one of your goals is to learn to code or to become a Web Developer in 2019 then I have something great to share with you today, the 2019 Web Developer RoadMap.This is an excellent illustration on how to become a web developer in 2019 and guide you on how you can learn and master Web Development in 2019.It’s a collection of different paths to learning front-end, back-end, and all other things a Web developer should know. You will not just know about web development but about essential #programming stuff which is important for all kind of programmers. The RoadMap (...)

#web-developer-roadmap #software-development #web-development #javascript

Start Using Superior Image #compression Today
▻https://hackernoon.com/start-using-superior-image-compression-today-932e8e086b72?source=rss----

https://cdn-images-1.medium.com/max/1024/1*BDCYb3Yx8exGZVu5lLRPNw.png

This article proposes use cases for new image codec and presents libraries to work with it on both front-end and back-end.Compression overviewFirst of all, why use better compression, doesn’t network bandwidth increase every year? Why media industry continues to push requirements for codec standards with even higher compression ratio?There are three major reasons for that:Network coverage. While you’re achieving 20 Gbps near the 5G cell, there are many places in town where speed isn’t that great at all.Traffic cost. Even if you download fast, most telcos charge you for every byte of data.Higher resolution and quality. Need at least 8K for 12.9” tablet for human-eye resolution, ideally lossless. We are not there yet.For example I browse web in underground a lot and inside tunnel fantastic LTE (...)

#av1 #superior-image #avif #javascript

Email Authentication with React native and #firebase
▻https://hackernoon.com/email-authentication-with-react-native-and-firebase-99b5e9a579e0?source=

https://cdn-images-1.medium.com/max/940/1*04AytyejhdInMFZme7p88w.png

There are various ways to authenticate a user might be by using Facebook, Google, Twitter, LinkedIn & Email etc. But Email authentication is still the most popular authentication method. In this tutorial, we will walk you through to create Email authentication with React native and Firebase.Featured React Native CourseThe Practical Guide to React Native: Build iOS/Android AppsMultiplatform Mobile App Development with React Native | CourseraUsing React Native with firebase make it easy to implement. So without wasting more time let’s beginFirst of all, create new react native project with the expo.Email Authentication with React native and Firebase using Expo:In this post, we are using expo for without touching Xcode or Android studio. Open up your terminal or command line and type  (...)

#firebaseauthentication #react-native #reactjs #javascript

Evaluating Dependencies — Falcor Case Study
▻https://hackernoon.com/evaluating-dependencies-falcor-case-study-4cfef4747e40?source=rss----3a8

Evaluating Dependencies — Falcor Case StudyA friend passed on a reference to Falcor, a #javascript framework that manages data exchange between a client application and a backend server. It was open-sourced by Netflix and is in current use as a core part of their client applications.He passed it along because he knew my interest (or more likely skepticism) would be piqued by their “One Model Everywhere” claim that“You code the same way no matter where the data is, whether in memory on the client or over the network on the server.One of the deepest principles I reinforced with any developer I worked with was that the distinction between local (fast, reliable, generally synchronous) and remote (slow, error-prone, always asynchronous) was fundamental and grounded in physics. It was one critical (...)

#software-development #evaluate-dependencies #hackernoon-top-story #software-engineering

Documentation | Buefy
▻https://buefy.org/documentation

Buefy (pronounced /ˈbyo͞oˌfī/, like beau-fy) is a user interface component library made on top of two fresh but very well known frameworks, being them Vue.js and Bulma. Buefy has two core principles: 1. keep stuff simple and 2. be lightweight.
We like to think that Buefy is the javascript layer for your Bulma interface, since it doesn’t require for it to be a sophisticated Single-Page Application. You can import it completely or single components on a ordinary webpage and use Vue.js as a replacement for jQuery

Pour mémoire :
– la doc du framework CSS Bulma (anglais) : ▻https://bulma.io/documentation
– la doc du framework Vuejs (français) : ▻https://fr.vuejs.org/v2/guide

#javascript #framework #vuejs #bulma

The 3 Lies Stopping You From Learning To Code
▻https://hackernoon.com/the-3-lies-stopping-you-from-learning-to-code-59e76cc8f1eb?source=rss---

https://cdn-images-1.medium.com/max/500/1*grLhTSWUvddYxJUP5gs7Xw.gif

Okay people, grab your goggles because I’m here to bust some myths wide open.You see, when you’re a “normal person” (read: not super smart) and also happen to be a successful software engineer — a lot of people ask you what your deal is.With a degree in Economics, a life in software engineering wasn’t quite what I was expecting. I simply took the least bad option in my career, right up until the point where people were paying money to code.With that kind of background, it’s no wonder I’m such a massive evangelist that literally anyone can learn to code.But most don’t.The reality is, most people have built coding up into this demigod of fear. And all those fears stem from the idea that “I’m not good enough”.So I’m here today to be a bit of a prick and tell you why you’re all wrong.But like, in a nice  (...)

#software-engineering #programming #junior-developer #javascript #react

JDK10, 11 et 12, quelques nouveautés
▻http://namok.be/blog/?post/2019/04/06/JDK10-11-12

http://namok.be/public/images/divers/2019/20190103_111905.jpg

Depuis JDK9, Oracle change le cycle de sorties des différentes versions de #java. Alors qu’avant, une nouvelle version de Java sortait tous les 2, 3 ans, c’est maintenant tous les 6 mois qu’une nouvelle version sera disponible.

Parmi ces version, certaines sont étiquetées long term support (LTS) et sont supportées par Oracle plusieurs années tandis que, pour les autres, le support ne durera que 6 mois. Les «  prochaines  » versions LTS de Java sont la 8 et la 11.

Ce billet recense quelques nouveautés des versions 10, 11 et 12 de Java et ne sera pas exhaustif. Je ne m’intéresse qu’à quelques fonctionnalités visibles pour les développeurs et les développeuses. Mes sources principales sont les pages Oracle recensant les JDK Enhanced Proposal (JEP).

JDK10

Cette version du JDK voit passer plusieurs (...)

#Cartable_au_dos #enseignement #esi #geek

Introduction to Test Driven Development (TDD)
▻https://hackernoon.com/introduction-to-test-driven-development-tdd-61a13bc92d92?source=rss----3

https://cdn-images-1.medium.com/max/873/1*PctatMK2pwPm2NrXuFs-ew.png

The Test Driven Development (TDD) is a software engineering practice that requires unit tests to be written before the code they are supposed to validate. Coming from the Agile world in which it is a basic practice of the Extreme #programming (XP) method, #tdd is nowadays recognized as a discipline in its own right that is also used outside the agile context. An overview and an introduction to a practice that you will not be able to do without!The Agile movement has continued to progress over the past fifteen years, leading to new and more pragmatic practices aimed at providing the client with the program that meets his needs as quickly as possible. For this problem, traditional methods based on the V-Model offer a “Test-Last” approach with unit tests written after the application code. (...)

#unit-testing #java #testing

Generating PDFs in #javascript for fun and profit!
▻https://hackernoon.com/generating-pdfs-in-javascript-for-fun-and-profit-c7af594cf697?source=rss

https://cdn-images-1.medium.com/max/1024/1*JF16M3jpe_n52JcB-hgZAQ.png

Up until recently, creating complex or elegant PDFs in Javascript has been challenging.Here I’m going to show you step-by-step the path of least resistance to beautiful PDFs. Spoiler: recently made possible by #docx to #pdf conversion in Javascript :-)What follows is some of what I will cover in my upcoming talk at PDF Association conference in Seattle in June.From 1000 feet, here are your three main alternatives:The first is to create the PDF directly, using pdfkit, jsPDF, or the higher level pdfmake. Pdfkit is like iText in the Java world. Pdfmake, based on pdfkit, has its own format for representing rich text; it converts this to PDF.The second is to create HTML, then convert that to PDF. These days probably using puppeteer.The third is to create a docx, then convert that to PDF.Put (...)

#pdf-converter #nodejs