Turning Text into a Tweetstorm

With tongue firmly in cheek, I created this script to take a chunk of text and break it up into a tweetstorm, for “readability". Sort of like the opposite of something like Mercury Reader. If the irony is lost on you, it’s a gentle ribbing of people who chose Twitter to publish long-form content, instead of, you know, readable paragraphs.

See the Pen Turning Text into a Tweetstorm by Chris Coyier (@chriscoyier) on CodePen.
It might …

Turning Text into a Tweetstorm is a post from CSS-Tricks

Link: https://css-tricks.com/turning-text-tweetstorm/

Announcing Oracle JET 4.0 and Web Components

This release of Oracle JET brings many new features. None bigger than a completely new Custom Element based syntax for defining all JET UI components. We believe you will find this new syntax more intuitive and natural to work with when developing your HTML content. This is being done to further our effort to stay current with HTML standards and specifications such as the HTML5 Web Component specification. To learn more about developing with this new syntax, refer to the JET Developers Guide.
While you don’t have to move to the new custom element syntax when you migrate your application to use v4.0.0, it is highly recommended that you start all new work using this new syntax. The custom element syntax can co-exist with the existing data-bind syntax (e.g. ojComponent) in the same page without any problems. They are designed to work together until the time the data-bind syntax has reached End of Life, which is currently planned for on or about the time JET v8.0.0 is released (approx two years from the v4.0.0 release).

Link: https://dzone.com/articles/announcing-oracle-jet-40-and-web-components?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Using Preact as a React Alternative

Preact is an implementation of the virtual DOM component paradigm just like React and many other similar libraries. Unlike React, it’s only 3KB in size, and it also outperforms it in terms of speed. It’s created by Jason Miller and available under the well-known permissive and open-source MIT license.
Why Use Preact?
Preact is a lightweight version of React. You may prefer to use Preact as a lightweight alternative if you like building views with React but performance, speed and size are a priority for you — for example, in case of mobile web apps or progressive web apps.
Whether you’re starting a new project or developing an existing one, Preact can save you a lot of time. You don’t need to reinvent the wheel trying to learn a new library, since it’s similar to, and compatible with, React — to the point that you can use existing React packages with it with only some aliasing, thanks to the compatibility layer preact-compat.
Pros and Cons
There are many differences between React and Preact that we can summarize in three points:

Features and API: Preact includes only a subset of the React API, and not all available features in React.
Size: Preact is much smaller than React.
Performance: Preact is faster than React.

Every library out there has its own set of pros and cons, and only your priorities can help you decide which library is a good fit for your next project. In this section, I’ll try to list the pros and cons of the two libraries.
Preact Pros

Preact is lightweight, smaller (only 3KB in size when gzipped) and faster than React (see these tests). You can also run performance tests in your browser via this link.
Preact is largely compatible with React, and has the same ES6 API as React, which makes it dead easy either to adopt Preact as a new library for building user interfaces in your project or to swap React with Preact for an existing project for performance reasons.
It has good documentation and examples available from the official website.
It has a powerful and official CLI for quickly creating new Preact projects, without the hassle of Webpack and Babel configuration.
Many features are inspired by all the work already done on React.
It has also its own set of advanced features independent from React, like Linked State.

React Pros

React supports one-way data binding.
It’s backed by a large company, Facebook.
Good documentation, examples, and tutorials on the official website and the web.
Large community.
Used on Facebook’s website, which has millions of visitors worldwide.
Has its own official developer debugging tools extension for Chrome.
It has the Create React App project boilerplate for quickly creating projects with zero configuration.
It has a well-architectured and complex codebase.

React Cons

React has a relatively large size in comparison with Preact or other existing similar libraries. (React minified source file is around 136KB in size, or about 42KB when minified and gzipped.)
It’s slower than Preact.
As a result of its complex codebase, it’s harder for novice developers to contribute.

Note: Another con I listed while writing this article was that React had a grant patent clause paired with the BSD license, making it legally unsuitable for some use cases. However, in September 2017, the React license switched MIT, which resolved these license concerns.
Preact Cons

Preact supports only stateless functional components and ES6 class-based component definition, so there’s no createClass.
No support for context.
No support for React propTypes.
Smaller community than React.

Getting Started with Preact CLI
Preact CLI is a command line tool created by Preact’s author, Jason Miller. It makes it very easy to create a new Preact project without getting bogged down with configuration complexities, so let’s start by installing it.
Open your terminal (Linux or macOS) or command prompt (Windows), then run the following commands:
npm i -g preact-cli@latest

This will install the latest version of Preact CLI, assuming you have Node and NPM installed on your local development machine.
You can now create your project with this:
preact create my-app

Or with this, ff you want to create your app interactively:
preact init

Next, navigate inside your app’s root folder and run this:
npm start

This will start a live-reload development server.
Finally, when you finish developing your app, you can build a production release using this:
npm run build

Continue reading %Using Preact as a React Alternative%

Link: https://www.sitepoint.com/using-preact-react-alternative/

Top Gantt Chart Solutions for Angular

In this article, we’ll take a look at three different Angular Gantt charts. Our field of interest includes the basic features and documentation. Without going into technical details, we’ll check what these charts can do and how easy it’ll be to find a particular documentation page that describes how you can reach the desired functionality. Well, let’s start!
1. angular-gantt

Link: https://dzone.com/articles/top-gantt-chart-solutions-for-angular-and-angularj?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev