Freek.dev

Laravel / PHP / AI

Posts tagged with javascript

Getting started with Facebook's React.js

React is a UI library developed at Facebook to facilitate the creation of interactive, stateful & reusable UI components. It is used at Facebook in production, and Instagram.com is written entirely in React.
https://scotch.io/tutorials/learning-react-getting-started-and-concepts

The application I'm currently working will need an advanced search feature that is backed by Algolia. Searches shouldn't hit the application server but use Algolia's JavaScript client. I'm in the process of learning React to build this. The link above was very helpful get started with this new technology.

I'm not ready to blog about my application just yet, but you'll hear more about it as soon as it goes live.

Read more

How to write an open source JavaScript library

Publishing a JavaScript library for public use requires some extra steps. You need to think about how people will use the library. From end users, to contributors your library now has a variety of people outside of yourself potentially making use of the code that you've released into the wild.

From Github and npm, to releasing beta versions, semantic versioning, code coverage, continuous integration, and providing your library with a solid set of unit tests, there are a ton of things to learn.

https://egghead.io/series/how-to-write-an-open-source-javascript-library

Read more

Join 9,500+ smart developers

Every month I share what I learn from running Spatie, building Oh Dear, and maintaining 300+ open source packages. Practical takes on Laravel, PHP, and AI that you can actually use.

No spam. Unsubscribe anytime. You can also follow me on X.

Making string concatination readable in JavaScript original

by Freek Van der Herten – 1 minute read

At Laracon EU Frank De Jonge gave a talk on modern JavaScript development. It struck a cord with me. On a project I'm currently working on I'm learning a bit of React and using some of these neat new JavaScript features. One of those features is called template strings. It allows you do make string…

Read more

We have a problem with promises

Q: What is the difference between these four promises? 
doSomething().then(function () {
  return doSomethingElse();
});

doSomething().then(function () {
doSomethingElse();
});


doSomething().then(doSomethingElse());


doSomething().then(doSomethingElse);



</div>
If you know the answer, then congratulations: you're a promises ninja. You have my permission to stop reading this blog post.</blockquote>
<a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html</a>



                            

                                            
                            Read more

Rendering ReactJS templates server-side

Some unknown guy (ok, he is famous for writing the fantastic Flysystem) has written an insightful post on his new blog on how and why to render ReactJS templates on the server.

Rendering your templates server-side has some obvious benefits. Since the contents of the page is there in the initial response, there's less page build-up. This will give your application a more snappy feel to it. It also ensures your pages can be correctly indexed by search engines. An additional bonus is presented in the way that React handles your pre-rendered page.

When React templates are rendered server side, a checksum is added. This hash is checked by the front-end ensuring the UI is in the correct state, and if so, that representation of the DOM is accepted, preventing any further rendering on the client. This, once again, creates a smoother experience in terms of performance.

I'm looking forward to Frank's future posts.

Read more

Fetch: the new AJAX API

One of the worst kept secrets about AJAX on the web is that the underlying API for it, `XMLHttpRequest`, wasn't really made for what we've been using it for. We've done well to create elegant APIs around XHR but we know we can do better. Our effort to do better is the `fetch` API. Let's have a basic look at the new `window.fetch` method, available now in Firefox and Chrome Canary.
http://davidwalsh.name/fetch

Read more

Private npm modules

When you pay for private modules, you can:
  • Host as many private packages as you want
  • Give read access or read-write access for those packages to any other paid user
  • Install and use any packages that other paid users have given you read access to
  • Collaborate on any packages that other paid users have given you write access to
Publish unlimited private modules for just $7/month.
https://www.npmjs.com/private-modules

Read more

Higher order functions in JavaScript

Functions that operate on other functions, either by taking them as arguments or by returning them, are called higher-order functions. If you have already accepted the fact that functions are regular values, there is nothing particularly remarkable about the fact that such functions exist. The term comes from mathematics, where the distinction between functions and other values is taken more seriously.
http://eloquentjavascript.net/05_higher_order.html

Read the article for some clear examples to help you understand the concept.

Read more

Babel, a JavaScript transpiler

ECMAScript 6 is the upcoming version of the ECMAScript standard. This standard is targeting ratification in June 2015. ES6 is a significant update to the language, and the first update to the language since ES5 was standardized in 2009. Implementation of these features in major JavaScript engines is underway now.
Babel will turn your ES6+ code into ES5 friendly code, so you can start using it right now without waiting for browser support.
https://babeljs.io/

Read more