Ui Design

A Professional eCommerce Design Some Things to Review.

If you would like to locate a web graphics designer that gives the ideal web hosting and the ideal ecommerce design and the best price on marketing your website, then they also have to have the ability to supply such service at a discount web design or cheap site hosting. If a website appears too cluttered, with many combinations of color’s, the user may not like it or they be delighted in the experience, another benefit of a professional internet designing firm like Graphic Don.

The web is a different sort of business channel. There are rather a lot of ways if we would like to learn about the needed marketing abilities obtain the intended search results needed to reach your return on your investment.

eCommerce website made simple to use

Enhanced Aesthetics only a professional site designer can assist your company to acquire and get acquainted with existing materials for promotion. On-line advertising might seem simple to some, built it is truly very complicated. An ideal ecommerce website design should have the following essential qualities to make sure a proper shopping during the on-line shop.

  • Bear in mind the client
  • Using a simple design of your website
  • Must have view cart
  • Be fair about pricing and honest
  • Don’t annoy the clients with unnecessary page elements.
  • Use high quality images
  • Must have reviews and/or testimonials
  • Easy to understand navigation menu
  • Best sellers’ section
  • Search bar with filter for products
  • Quick, simple checkout
  • A site ought to be made interactive

When you produce a site design, it needs to be hosted to become available for public viewing. You may even make a web site at a comparatively low price. If nobody is aware that the on-line shopping site exists, it won’t get any clients. By abiding by the vital ideas, you can begin to develop your site with professional site development business with Graphic Don to its potential and earn more money than predicted.

Your site design ought to be a distinctive one, which won’t just draw the most sum of visitors to your site but also turn them into buyers. There are several unique approaches to advertise a site. It could be simple to generate an eCommerce site, but there’s a huge difference between having a site and running a thriving company. Social media accounts have become a step in the right direction, post images of your products, you may use unique categories and articles and hand-coding HTML to design sites is also a fantastic method if you’re proficient enough.

Possessing a fantastic web site not only increases your likelihood of success when the user is on your webpage. Because you can see above, installing a new theme for your site is quite effortless. Firstly, be sure your site has a blog area that’s fully integrated into your website rather than external like Blogspot, which also can be utilized.

link building

Link building critical portion of SEO, GraphicDon provides.

Link building is a critical portion of SEO, that’s why GraphicDon provide a hyperlink building service for our clientele. Backlink building is crucial for your internet enterprise. Utilizing a hyperlink building service may work out well for you whether you select the perfect package.


If you’re just curious about link building, maybe you don’t need to sign on for several of months with the exact same support. The hyperlink building companies control panel has ranking reports that enable you to understand precisely where you stand in the search success. If you’re looking a quality backlink building assistance, place an order with GraphicDon.

Naturally, another benefit of link building and with an expert link building service is you can acquire real outcomes. It’s critical to be mindful of them if you wish to get the most out of your link building strategy. While you might know that link building is a significant portion of your search engine marketing strategy, you may be unsure about whether you ought to use link building services to help you realize your ends.

When it has to do with getting somebody else to do your link building for you, there are advantages working with graphicdon.com, there are a lot of misconceptions too, Link building for English-based sites is an ambitious endeavor.

Adding fresh content to your website regularly is an excellent way to boost your search engine rankings. Building backlinks is a slow and tedious practice. To boost your website’s search engine optimization, it is essential that you work on link building. GraphicDon loves what content does for your site, we highly recommend our content writing services, with 10000 words per month you will be gaining search engine placement and more customers in no time.

You can opt to use our backlink building service which can ease the full course of action. The hyperlink building service directory has a helpful control panel at which you can easily track your progress of your search engine optimization and link building campaign.

All you need to do once you’ve created a blog is post some fresh content with contextual anchor text backlinks going to your site. Another significant suggestion is to earn forum and blog postings. test out each URL to determine keyword usage in your seo optimized content.

For instance, you may want the links going vertically rather than horizontally. HTML links do several things for your site. When writing internal links make certain you don’t overdo it.

To contact the index page, you want another hyperlink. Link Preview isn’t just for search engines or web directory. however, it can be utilized on any internet page. To make sure every page of your website is indexed by search engines, do not utilize Flash in the website’s design. For instance, if you’re on the base of a Web page and there’s an HTML link that takes you back to the top that’s an illustration of a same-page link. You should come to realize that the index page will load. There is yet another type of relative link you might wish to use.


Exceptional website, keep it simple, pick from several designs.

The exceptional website management businesses let it be simple for you to pick from several services so you can secure a finished product that satisfies your needs without damaging your bottom line. The time necessary to apply is dependent on the job you’re applying for and the agency’s requirements. Today’s market for quality site managers are very difficult to discover, a lot of the companies aren’t located inside the States.

Each continuing project receives its own comprehensive review, which enables you to rapidly see its wellness. Website management providers rely on customer satisfaction, and this means you will receive the best service. Campaign management has become the most crucial part internet marketing for virtually any organization.

If your agency often takes on an identical kind of projects, having templates will help you save you a great deal of time. Graphic Don is client-oriented and is based on the scenarios and the individual or project objectives.

In conclusion, every company needs to have a well-designed site that supplies an effective point of contact for folks to acquire information concerning the firm. Consequently, if you’re searching for Graphic Don which you could trust, give us a call or begin your on-line quote today. If you’re working through design and strategy, it may make sense to have someone ready to work in where you are.

The company website is a focal point that makes your organization, company or organization easily accessible to anybody. The proprietors of tourism industry invest their money with the sole goal of getting high returns from the investment. If you’re attempting to take your company to the next level you’ve found the perfect business.

With Magento the design and development of an internet shopping website can be finished as soon as you need it. Together with looking for problems, providing your website maintenance should also have enough support, with search engine marketing expertise in order to pass along recommendations which could make your site even more attractive to the search engines. Business website development is a continuous process the perfect site on earth is useless unless people find it!

Your whole web design will be rebranded, they are currently able to attract customers and sell online. A well-developed web page can help you generate plenty of money, and the deficiency of website usually means that you’re entirely unconnected to a most important issue with the marketplace. Its internet presence provides you the ability to control your site even in the event you don’t have some technical experience, experience with HTML or web site design.

if you will soon need an excellent website design to produce a great impression, you need Graphicdon.com. Make certain you are aligned on what are your immediate needs for an excellent website. Your site is a valuable marketing and advertising tool and the important aspect in creating inbound leads.

r/webdev - I built a learning platform using Next.js, TypeScript, and Framer Motion!

I built a learning platform using Next.js, TypeScript, and F…

Hey r/webdev!

I’ve been writing video courses on mobile and web technologies for a little while now, and as they’re spread out over a few different learning platforms (YouTube & Udemy etc), I wanted to build a site to consolidate them together. It’s called CodeSnap.io!

r/webdev - I built a learning platform using Next.js, TypeScript, and Framer Motion!

I thought it’d be a good opportunity to brush up on my SSR, so I used Next.js & React to build it out with TypeScript and Styled Components, and all the animation work was done using Framer Motion. Data fetching is from Contentful’s GraphQL API using urql, then deployed to Netlify using next-on-netlify.

If anyone’s interested in seeing the repo, drop a comment letting me know – I might clean it up a bit and open source it if there’s enough demand.

There’s not a bunch of content in there right now (😅), but I’ve got a few courses in the works that I’m really excited about releasing over the next few months. Would love any feedback on the site you might have on it.


Source link

r/webdev - Request body not sending to Express when using Axios in React, but works in Postman

Request body not sending to Express when using Axios in Reac…

Hey guys,

I am running into a strange issue that only occurs on one ‘DELETE’ request sent to only one endpoint.

r/webdev - Request body not sending to Express when using Axios in React, but works in Postman

Ignore the cut off, its used for MongoDB, but commented out everything but this and a response

When I run the request in Postman, the console logs the body object and the entry is in there.

r/webdev - Request body not sending to Express when using Axios in React, but works in Postman
r/webdev - Request body not sending to Express when using Axios in React, but works in Postman

However, when running the same request from React using Axios, the console doesnt recieve the body for some reason.

r/webdev - Request body not sending to Express when using Axios in React, but works in Postman
r/webdev - Request body not sending to Express when using Axios in React, but works in Postman

I am totally lost as to what is going on here. Could I get some guidance? I’m seriously interested in finding out what my mistake was 😀

Source link

8 JavaScript Chart Components for Business Apps

8 JavaScript Chart Components for Business Apps

The ability to visualize complex data in a clear and comprehensible way is one of the key requirements of modern business applications. Various types of charts make it much easier to analyze statistical data, prepare any kind of reports, and facilitate decision-making. Therefore, web developers are often asked to integrate charting tools in apps. If that’s your case, you’ve opened the right page.

You will probably agree that developing a charting functionality from scratch can be very time-consuming. That is why it can be reasonable to consider using ready-made JavaScript chart components designed specifically for this task.

In this article, we will consider eight popular commercial JavaScript charting libraries that suit well for developing business applications. We will review general information on each product and pay attention to the key aspects that are always taken into account by developers before selecting the right tool: types of available charts, integrations, exporting formats, package size, and price.

Let’s get to it!


DHTMLX Charts is a lightweight and fully customizable JavaScript chart component for building various types of charts with support for all popular browsers and touch devices. This library comes with a powerful set of charts that can be used separately or combined for covering most of the data visualization needs in any business app. The design of DHTMLX Charts is based on Material style. You can create your own CSS classes with custom settings to adjust the look and feel of charts and their elements to the requirements of your project.

Using an extensive API of this library, you can easily configure common properties (scales, series, legend) of all available chart types in the desired way. It is possible to enrich charts with numerous useful features such as grid lines, threshold line, baseline, logarithmic scale, legend alignment, and much more. Not a single change in data will go unnoticed, as DHTMLX Charts render data dynamically and all data modifications are clearly illustrated in real time. Data is loaded in charts in the JSON format from local or external sources. Interestingly, DHTMLX Chart can be used as a separate library or in combination with DHTMLX Suite UI components for building consistent web apps.

Not much time is needed to start working with DHTMLX JavaScript charts, as its initialization takes only several simple steps. Get a foretaste of utilizing this library in the DHTMLX code snippet tool.

  • Main chart types: Line, spline, stacked, bar, X-bar, area, spline area, pie, 3D pie, donut, scatter, and radar charts
  • Integration with JS frameworks: React, Angular, Vue.js
  • Exporting formats: XML, JSON, CSV
  • Package size: 373 kB
  • Trial version: DHTMLX Charts
  • Price: $79 – $359


FusionCharts is a JavaScript library providing a large collection of interactive charts (100+) that can be added to business dashboards. Here, you can find general-purpose charts (bar, line, area) as well as more complex tools like XY plot and Pareto charts. All charts are responsive and render well in modern or old browsers. FusionCharts allows for utilizing default or custom themes to ensure that charts will conform to the design standards of your app.

In addition to standard functions such as tooltips or legends, the library provides many other features for creating data-intensive visualizations. For instance, you can apply data plots, trendlines, annotations, chart branding, data drilling,  and more. If you have difficulties in accurately positioning several charts on one page, the space management functionality will help to arrange them and save more space.

  • Main chart types: Column, bar, line, area, pie, donut, stacked, bubble, market share, Pareto charts
  • Integration with JS frameworks: React, Angular, jQuery, Vue.js, Ember, AngularJS, React Native, Svelte
  • Exporting formats: PDF, PNG, JPEG, Excel 
  • Package size: 4.61 MB
  • Trial version: FusionCharts
  • Price: $499 – $2,499 (annual license) / $1,299 – $6,499 (perpetual license)


amCharts is a programming library offering a package of charts for presenting data in different graph formats in JavaScript and TypeScript apps. The library uses an in-house-developed SVG rendering engine with incorporated filters and animation support for building interactive interfaces. amCharts is quite flexible, as you can configure any chart elements and specify how they will look under certain conditions (clicking, hovering, change of numerical data, etc.). The availability of color sets, gradients, modifiers, and multi-theme support allows adopting a more creative approach to the styling of charts. You can also apply contrast themes and enable keyboard navigation.

amCharts relies on utilizing threaded data parsing as well as on reusing and rehashing chart elements rather than redrawing them to achieve better performance. Incremental data updates enable you to manage chart data dynamically. All numeric and string values used in charts are brought to a common format with the help of formatters. Special adapters will help you to override default settings and modify charts using custom code. If it is necessary to show more information related to charts, popups and modal windows are at your service.

  • Main chart types: line, area, column, scatter, floating, stacked, pie, donut, funnel, pyramid, and pictorial charts
  • Integration with JS frameworks: React, Angular, Ember, Vue.js
  • Exporting formats: JPEG, PNG, PDF, XLSX, CSV, JSON
  • Package size: 22.6 MB
  • Trial version:amCharts
  • Price: $180-$8,925


Highcharts is a JavaScript charting library based on native browser technologies that can be used for cross-platform and cross-browser web app development. It provides a range of interactive charts with touch/mobile-optimized design. Highcharts allows managing the design of charts separately from the data functionality and creating custom themes in the styled mode. The capability to render large data sets is ensured by the WebGL-powered boost module.

The Highcharts debugger helps to detect and fix coding errors faster. The support of TypeScript declarations facilitates working with the library in TypeScript-capable editors. You can also implement a chart editor in the app, enabling end-users to create and publish charts without coding. Users can also interact with charts by placing annotations. The library follows several accessibility standards (WCAG 2.1, Section 508, EU Web Accessibility Directive) and supports the sonification of data. If the existing Highcharts feature set is not enough for you, it can be extended with animations and more complex functionalities. 

  • Main chart types: Line, spline, area, column, bar, pie, scatter, gauges, polar, radar, pyramid, polygon series, Pareto charts
  • Integration with JS frameworks: Angular, React, Vue.js
  • Exporting formats: PNG, JPG, PDF, SVG vector images
  • Package size: 43.2 MB
  • Trial version: Highcharts
  • Price: From $535


AnyChart is a JavaScript visualization solution that enables developers to implement charting functionality in mobile, desktop, or web apps. With AnyChart, you can show data with multiple charts out-of-the-box or create your own charts. When it comes to visual adjustment of charts, you can apply predefined color formats, palettes, or themes, or come up with custom schemes.

If you need to complement charts with additional information or annotations, AnyChart provides a range of ready-made drawing tools. Charts can also be equipped with technical indicators for data analysis. Multiple localization options (194 locales) make Anychart adaptable to different language versions. It is also possible to share your charts created with AnyChart with others in popular social networks. AnyChart uses the data sets mechanism and data streaming to handle data visualized in charts. Data can be loaded in charts in different formats (XML, JSON, CSV, Google Spreadsheet, HTML Table).

  • Main chart types: Pie, donut, column, bar, line, scatter, area, range column, and Pareto charts
  • Integration with JS frameworks: Angular, React, Vue.js, Ember, Meteor
  • Exporting formats: PDF, PNG, JPG, SVG, CSV, Excel
  • Package size: 11.9 MB
  • Trial version: AnyChart
  • Price: From $49

Webix Charts

Webix Charts is a JavaScript charting widget that can be used in web apps for visualizing business-related data. The widget is a part of the Webix UI widget pack. It consists of multiple chart types with various styling and positioning settings. Style presets help change the appearance of charts on-the-fly. There is a range of useful operations for interacting with chart data such as sorting, filtering, grouping, adding, and deleting items. Webix charts comply with the Section 508 accessibility requirements. 

The possibility to apply stacked graphs (stacked bar and area charts) allows showing a part-to-whole data relationship. Building charts complemented with elements from other types is also possible. Webix charts with a horizontal scale can be coupled with a special RangeChart component for working with large amounts of data. Static charts can be transformed into dynamic for working with frequently updated information. 

If you cannot find a specific chart type for your project in the list of available options, integrate third-party charts and use them as Webix components. 

  • Main chart types: Pie, 3D pie, donut, line, spline, area, spline area, bar, stacked bar, radar, and scatter charts
  • Integration with JS frameworks: jQuery, Angular, React, Vue.js, Backbone
  • Exporting formats: PNG, Excel
  • Package size: 7.28 MB
  • Trial version: Webix Charts
  • Price: $849-$9,499 (can be purchased only with other UI widgets included in the Webix package)

Ignite UI Charts

Ignite UI Charts is a JavaScript UI component intended for visualizing various business and financial charting scenarios. It is one of the top components of the Ignite UI toolkit designed by Infragistics specifically for enterprise apps. All charts are mobile- and cross-browser-friendly. 

Multiple interactive features (series highlighting, crosshair, etc.) help end-users to work with the charts more productively. The Ignite UI’s Zoombar comes in handy when it is needed to focus on particular chart details for deeper data analysis. Trendlines and sparklines are useful for spotting and evaluating tendencies in statistical info. The Infragistics Motion Framework enables you to add interactive animations. The component uses remote and local data binding.

Infragistics also provides the  HTML5 Page Designer tool that allows you to play around with the code and design of Ignite UI Charts and estimate the suitability of this component for your project.

  • Main chart types: Bar, donut, stacked, scatter, area, waterfall, OHLC, spline, pie, financial, funnel charts
  • Integration with JS frameworks: ASP.NET (Core and MVC), Blazor, jQuery, Angular, React, Web Components
  • Exporting formats: PDF, XPS
  • Package size: 10.5 MB
  • Trial version:Ignite UI
  • Prices: $849-$1,099 (can be purchased only with other UI components included in the Ignite UI package)

Syncfusion Charts

Syncfusion Charts is a UI control from the Essential JS 2 library written in TypeScript for illustrating data by means of charts and graphs. It contains a bundle of customizable charts (30+) with embedded interactive features (trackball, events selection, drill-down, etc.). Charts can also have animations and be updated with live data. You will need less than 150 kb to depict a simple Syncfusion chart.

The control supports SVG and Canvas rendering methods. It also has a mobile adaptive architecture and complies with ECMAScript 6 standards to permit rendering in modern browsers. Data binding can be implemented with the use of various services such RESTful, OData, WCF, or JSON. Internationalization and localization settings (including RTL mode) will help to make your charts understandable to users from all over the world.

  • Main charts types: Line, area, bar, spline, stacked, range, correlation, polar, radar, financial charts
  • Integration with JS frameworks: Angular, React, Vue, Blazor
  • Exporting formats: JPEG, PNG, SVG, PDF
  • Package size: 23.3 MB
  • Trial version:Syncfusion
  • Prices: Starting from 995$ (can be purchased only in a single package with other UI controls from Essential JS 2)

Closing Thoughts

As you can see, there are many possibilities for visualizing datasets of any complexity in business web applications. All reviewed JavaScript chart components have many powerful features, but it is hard to name any of them a one-size-fits-all solution. That is why it is important to choose the tool that maximally meets the requirements of your project, fits into the budget, and allows creating charts with minimum time and effort. 

Source link

Why is this happening to my numbered bullets?

Why is this happening to my numbered bullets?

Why is this happening to my numbered bullets?


For some reason, the "4" bullet gets tabbed over really far. The fifth bullet and everything before it look fine. I have no idea why is this happening, any ideas? I've played around with the indents but I can't fix it.

submitted by /u/stereoheartart

Source link

Graphical user interface, application, Teams Description automatically generated.

Jumping into Heroku Development – DZone Web Dev

The purpose of this second article is to explain what I’ve learned from a series of 10 Trailhead Live video sessions on Modern App Development on Salesforce and Heroku.  In these articles I’m walking you through how to combine Salesforce with Heroku to build an “eCars” app, a sales and service application for a fictitious electric car company (“Pulsar”) that allows users to customize and buy cars, service techs to view live diagnostic info from the car, and more.  

This article is going to cover setting up Heroku, installing LWC, and setting up the deployment for our app.

As a quick reminder, I’ve been following this series to stay current on the latest app development trends on these platforms, which are key for my career and business.  I’ll be sharing step-by-step building the app, what I’ve learned, some of the highlights, and my personal take on some of the content.

In the Last Article…

In the last article, we walked through an overview of the Salesforce and Heroku Platforms and how they can work together.  We also did some pre-work to get set up for building the eCars app.  So, if you are jumping in at this point, here are the following prerequisites you will need:

For this article, there is another free account to sign up to start exploring Heroku.

The only catch with the “Free Hobby” version of Heroku is that the dyno will automatically turn off when it’s not in use. There is also a limit of 500 hours of uptime per month on the free tier.  It seems pretty fair to me, if they’re going to offer me some free compute resources, it’s only reasonable that they turn off the lights when I’m not actively using the resources.

Diving into Heroku

Let’s start with an introduction to Heroku, all the bells and whistles it comes with, and how to get quickly up to speed with deploying an app on the platform.  If you’re not familiar with Heroku, it’s a PaaS solution for quickly creating and deploying apps.  With Heroku, the idea is for developers to focus on building their app, and the platform takes care of the infrastructure stuff (DevOps, scaling, environments, and so on). 

One of the handy things about Heroku is the Buildpacks you can select and launch right off the bat.  I’ve played around with setting up an Amazon EC2 application server from scratch.  I’m not afraid to admit that I spent a good two hours sorting through documentation and help articles just to install the right pre-requisites on the instance.  

With Heroku, however, you can just pick your programming language and Heroku will quickly create a turnkey process with these Buildpacks to get going with a particular language.  

Heroku has 8 main officially-supported languages: Node.js, Ruby, Python, Java, PHP, Go, Scala, and Clojure.

However, there are many community Buildpacks available for other languages and frameworks as well.  

Graphical user interface, application, Teams Description automatically generated.

For the eCars app we’re building, we’re using the Node.js Buildpack. While, at the time of this writing, I certainly understand and can work my way through javascript code, I wouldn’t say I have as much depth specifically with Node.js as I have with Salesforce APEX and Visualforce code. However, I’m looking forward to diving a little deeper into Node.js as I consider it cross-training for Salesforce aura and Lightning Web Components.

Going through the Buildpack for Node.js is super simple.  The step-by-step instructions and links to required installed components are straightforward to follow, and I found myself up and running with Node.js in under 30 minutes.

You should also install the current Long-Term Support (LTS) version of Node.js. At the time of this writing, the LTS version is 14.15.1.

Graphical user interface, application, Teams 
Description automatically generated

Turnkey process and instructions for getting started with Node.js on Heroku

VSCode CLI Exercises and Installing LWC

I mentioned earlier that Node.js would be good cross-training for Lightning Web Components (LWC).  In fact, the next step is to actually install LWC using npm, which comes with Node.js installed earlier. Follow the code snippet below:


After following the instructions at the link above on the VSCode command line, and answering three questions about the type of app I wanted to create, npm was quickly on its way to installing all the dependencies for the LWC app.  Although I don’t understand what all the installed dependencies mean, I can appreciate all the hard work that went into making the app easy to use.

After a few minutes of installation, the sample LWC app was up and running on my localhost machine on port 3001.  At this point, one could continue building and testing the app locally until ready to deploy to Heroku.

Deploying the Local Sample LWC App to Heroku

Now let’s deploy to Heroku. Deploying the app to Heroku is a simple exercise. You only need to know several git commands with some Heroku flavor attached.  Heroku is git-based so whatever you’re deploying needs to be under git source control.  The commands to then deploy are simple and should be familiar to anyone who has used git commands on a command-line interface:

  1. Create your Heroku app with the desired name.

heroku create [app name] 

  1. Commit Something to Git for Deployment

git commit

  1. Push the Source to the Main Branch on Remote Heroku Git Server to Deploy

git push heroku main

There are some deeper level items on this topic, such as the Procfile and package.json. These files deal with the application’s dependencies and instruct Heroku on how to build and compile the application.  For now, this is perfectly sufficient as I have moved a local application to the remote Heroku host URL to make it accessible on the web.

Dynos, Scaling, and Concluding Thoughts

The session on Heroku involved a deep dive into Heroku’s “dynos” or a  unitized computing package required to run a particular app.  Without knowing how this all works under the hood, what you need to understand is that Heroku has some easy-to-use scaling features that add scale and power to the application vertically and horizontally to guarantee a certain level of uptime even in the face of spikes in usage.  

To scale horizontally, you add MORE dynos to your Heroku application.  Doing so can let Heroku route incoming requests across more running instances of your web servers, which improves performance with high traffic situations.  Adding more dynos also allows your app to process more tasks in parallel, and handle a higher volume of jobs. There are, however, some cases where scaling horizontally doesn’t help, such as bottlenecks on services and long-running requests.  Usually, in these cases, the individual dynos are overloaded so parallel processing doesn’t help.

On the other hand, vertical scaling refers to making each dyno more powerful individually.  Upgrading dynos to larger dyno types will provide your app with more memory and CPU resources so that the performance of the individual dynos are improved.

So if you imagine a factory with machines making trinkets, you can improve throughput by adding more machines (horizontal scaling) or by making each machine run faster (vertical scaling).  

When I hear stories about a website or server crashing due to a sudden influx of visitors, I often wonder what kind of infrastructure those sites are running on and whether they would have crashed if they were using Heroku.

After working on the Lightning Web Components (LWC) part of the app, I admit that as someone who has lived in APEX and Visualforce for many years, I am anxious about the shift towards Javascript-based aura and Lightning Web Components as it involves learning and adapting to a new framework that isn’t always my first go-to for building custom UI/UX components in Salesforce.  However, this is certainly a trend I will have to embrace since the larger developer population is composed of more people who understand and work with Javascript than those who understand APEX.  

It’s smart for Salesforce to attract and teach an existing population of Javascript developers to further enrich the entire Salesforce ecosystem.  However, the silver lining to keep in mind is the number of resources there are in the ecosystem to help first-time Salesforce, APEX, and Lightning Web components users get information and training on the platform in a very short time.

What’s Next?

Ok, so now we’re all set up with Heroku, LWC is installed, and our deployment is ready. In the next article, we’re going to learn about data modeling in Salesforce, set up the data model, then explore the integration between the two platforms by connecting Heroku to the Salesforce data using Heroku Connect.

If you haven’t already, consider joining the official Chatter group for this series. It is a great opportunity to post questions and start discussions with the group.

About the Author

I’m an 11x certified Salesforce professional who’s been running my own Salesforce consultancy for several years. If you’re curious about my backstory on accidentally turning into a developer and even competing on stage on a quiz show at one of the Salesforce conventions, you can read this article I wrote for the Salesforce blog a few years ago. 

Link to the on-demand session recording.

Thanks to Jason Sun for his kind permission to publish this article!

Source link

Game Development in a Service IT Company

Game Development in a Service IT Company

It’s always very easy to do what you have been doing for many years and copy what has already been done by others. And, it is an obvious fact that every company has its unique set of strengths and expertise in the market. But, everyone also understands that growth is not possible without getting out of your comfort zone and stepping forward into the unknown to create innovation.

We took that step in the game development world, and now, we can share the main challenges we faced developing our first mobile game created fully in-house. This was probably the first commercially available mixed reality simulation on a mobile platform in which a player feels like they are in the center of a large scale Hollywood blockbuster.

For the general public, it sounds very easy to create a game and launch it, especially if you have a lot of creativity and inspiration to do it. But, what if you decide to create something unique and unusual for the market? What if you want to be the first one to find a solution for mixing the physical and virtual worlds? And, what if you aim to achieve your goal, not on some specific devices, but make it available to the mobile mass market?

There is a long history of AR/VR crush in Sigma Software. We started our development efforts a long time ago with the entrance of the first AR/MR user devices like Epson Moverio, Microsoft HoloLens, and Magic Leap into the market. While testing the waters of mixing physical and virtual realities, we created a tech demo to showcase our AR/VR expertise. The demo attracted a lot of attention, and after some time, we decided to create our first mobile game based on this showcase.

An Idea as the Main Driver

There were many ideas for the game discussed and weighted, but finally, the decision was made to go for a shooting game that would turn the users’ familiar surroundings into a SciFi alien invasion movie and the user into a warrior inside a huge battle robot, commanding a fleet of spacecraft to defend Earth. The game was named Black Snow.

We were lucky to have an initial core team with decent experience in game creation. We had a wild card on our hands and decided to go even further to create a unique, fully immersive AR game for mobile devices.

At some point, we understood that a new task clearly presented a serious challenge, even for the seasoned team. Driven by the idea, we expanded and strengthened our game development team to embrace all the skills and expertise required to tackle something which had never been done before. It would be an understatement to say that our team is the most valuable asset we had then and have now.

Technology as the Main Challenge

Game development took more than two years with a bunch of complex engineering tasks that the team had to solve. These included creating an augmented reality for an open world, as well as achieving a full immersion effect with graphics alignment, surround sound, and haptic feedback. To ensure a seamless experience, we used calibrations hidden from the user and immediate access to the gameplay.

Furthermore, we faced the need to combine and balance different game mechanics, as well as to deploy a global geo-game. The game had real-time multiplayer capabilities together with cinematic large-scale gameplay. The team worked hard to create an intense game experience and augmented reality similar to Microsoft HoloLens and MagicLeap on a common smartphone. Unlike other AR games, the playing area of Black Snow stretches for 2 kilometers in every direction from the player’s location.

Environment as a Must-Have Requirement

When creating a game, you will definitely need not only your creativity and imagination to check your ideas and the real implementation, but also a fully available environment for your team. Since our main goal was to give a unique AR experience to our players, we created our AR/VR lab to test all our latest development findings and implement the best of them in our Black Snow game. We started with alpha testing by using all available resources. In parallel, we were investigating new devices, modern technologies, and tools to create a unique game experience and “wow” effect for our players around the world.

We were acting like a startup to be as agile as possible and to get the first results asap. Our team learned how to do marketing, analytics, playtests, and even App Store console management to speed up the process and correct our actions and further steps.

However, game development is always hard to put into some frameworks and fit into some standard project procedures. We wanted to avoid having procedures that resulted in creating a game that was simply not fun for the players. On the other hand, when working without a process at all, you can end up with terrible results. That’s why we combined our Sigma Software great enterprise experience with the game development agility and best practices to develop the creative and manageable processes to achieve our goals.

The Final Result as the Best Reward

We pushed our first game into Live on the App Store in June 2019. It was an amazing day when the whole team understood that we achieved our initial goal — we created and soft-launched a fully immersive AR game available for handhelds, enabling players to try stunning, fully 3D large-scale cinematic aerial battles like nothing they’ve ever seen on a mobile phone. Everyone knew there would be a long process of polishing and improving the game, however, our team will always look forward with confidence.

Now, the Black Snow game has been launched for iPhones in 18 countries, and this list will expand soon. Follow the news about Black Snow’s expansion on Black Snow TV and on our social media channels on Facebook, Instagram, and YouTube.

Source link

What if you could cut your hosting costs by 80%? Webiny Serv...

What if you could cut your hosting costs by 80%? Webiny Serv…

Are you hosting one or more websites and are using a headless CMS? Are you hosting your CMS on a virtual machine or a container, or using a SaaS solution? If so, then you’re paying for the uptime, regardless if the server or service is serving requests or not. Essentially, you are paying for stuff you are not using. And in this article look at how how you can change that and save up to 80% of your hosting cost along the way.

Serverless — what’s that about?

If you’re new to serverless, in short, serverless is set of services you’re consuming without worrying about the underlying infrastructure. There are services for compute, like AWS Lambda that allow you to run Node.js code, services for storage like S3, database as a service like DynamoDb and many others.

The benefits of serverless are:

  1. You are billed based on your consumption
  2. There are no servers for you to manage
  3. Services scale automatically
  4. Services are more secure than your regular server

Servers are still there, but they are abstracted away — out of sight, out of mind.

Out of all the benefits, the first one plays a big role. Picture an API on a regular server or a virtual machine. If that server is not handling a new request every few seconds, there is a lot of idle time where the server is not doing anything, but you’re still paying for it.

With serverless you pay per your consumption, if your API is not handling any request at that point in time, your cost is $0. To further back this case, a research made by Deloitte found that a larger system can save anywhere between 60-80% in infrastructure costs and up to 60% in management costs just by switching to serverless.

Although serverless sounds great, there is a down side to it. It’s quite complex and time consuming to create new solutions from scratch and existing solutions are not designed for such environments. This is where Webiny comes in.

Webiny Serverless CMS

To help you adopt serverless and build websites on top of this modern infrastructure, there is one solution you can use today, for free. Webiny Serverless CMS is an open source solution that comes with a few apps, including a GraphQL-based Headless CMS.

Some of its features:

  1. GraphQL API
  2. Content versioning and modeling through a UI
  3. Multi-tenancy & Multi-language support
  4. Powerful user access control
  5. Built-in image optimization and image editor
  6. Works with existing static page generators like Gatsby and others

It’s important to note that Webiny Serverless CMS is completely free and self-hosted — all you need is an AWS account.

The system is self-hosted on top of the AWS serverless offering, and your sites will benefit from it in the following ways:

  • High-availability and fault tolerance for your API
  • 99.999999999% (11 9’s) of data durability
  • Enterprise-grade secure and scalable ACL
  • Event-driven scalability — pay for what you use
  • Great performance using a global CDN
  • DDoS Protection of your APIs

All this is in the box and it takes less than 10 minutes to get up and running.

Comparing Webiny to other solutions on the market — this is what it looks like:

Get started with Webiny Serverless CMS and stop overpaying for your infrastructure.

Source link

My open-source job board now tells which technologies in high demand to be a full stack developer.

My open-source job board now tells which technologies in hig…

My open-source job board now tells which technologies in high demand to be a full stack developer.


I have added a new feature to my open source job board to count the number of times a technology is asked in job positions and show them in the filter tag. check it out here:

submitted by /u/harsh611

Source link

Pete LePage

New in Chrome 88  |  Web  |  Google Developers

Chrome 88 is starting to roll out to stable now.

Here’s what you need to know:

I’m Pete LePage, working, and shooting
from home, let’s dive in and see what’s new for developers in Chrome 88!

Manifest v3

Chrome 88 now supports extensions built with manifest v3, and you
can upload them to the Chrome Web Store. Manifest v3 is a new extension
platform, that makes Chrome extensions more secure, performant, and privacy
respecting, by default.

For example, it disallows remotely hosted code, which helps Chrome Web Store
reviewers better understand what risks an extension poses. And should allow you
to update your extensions faster.

It introduces service workers as a replacement for background pages. Since
service workers are only resident in memory when needed, extensions will use
less system resources.

And to give users greater visibility and control over how extensions use and
share their data, in a future release we will be adopting a new install flow
that allows users to withhold sensitive permissions at install time.

Check out developer.chrome.com
for complete details, and how to migrate your current extension to manifest v3.

CSS aspect-ratio property

Normally, only some elements have an aspect ratio, for example images.
For them, if only the width, or the height, is specified, the other is
automatically computed using the intrinsic aspect ratio.

<!-- Height is auto-computed from width & aspect ratio -->
<img src="..." style="width: 800px;">

In Chrome 88, the aspect-ratio property allows you to explicitly specify an
aspect ratio, enabling a similar behavior.

.square {
  aspect-ratio: 1 / 1;

You can also use progressive enhancement to check if it’s supported in the
browser, and apply a fallback if necessary. Then, with the new CSS 4 not
selector, you can make your code a little cleaner!

.square {
  aspect-ratio: 1 / 1;

@supports not (aspect-ratio: 1 / 1) {
  .square {
    height: 4rem;
    width: 4rem;

Thanks to Jen Simmons
for calling out this is supported in the latest Safari Technical Preview,
so we should see it in Safari soon! And check out
Una’s demo to see it in action.

Heavy throttling of chained JS timers

Chrome 88 will heavily throttle chained JavaScript timers for hidden pages in
particular conditions. This will reduce CPU usage, which will also reduce
battery usage. There are some edge cases where this will change behavior,
but timers are often used where a different API would be more efficient, and
more reliable.

That was pretty jargon heavy, and a bit ambiguous, so check out Jake’s article
Heavy throttling of chained JS timers beginning in Chrome 88
on developer.chrome.com for all the details.

Play billing in Trusted Web Activity

You can now use Play Billing in your Trusted Web Activity to sell digital
goods and subscriptions using the new Digital Goods API. It’s available as an
origin trial in Chrome 88 on Android, and we expect it to expand the origin
trial to Chrome OS in the next release.

Once your accounts are set-up, update your Trusted Web Activity to enable Play
billing, and create your digital goods in the Play Developer Console. Then,
in your PWA, add your origin trial token, and you’re ready to add the code
to check for existing purchases, query for available purchases, and make new

// Get list of potential digital goods

const itemService =
  await window.getDigitalGoodsService("https://play.google.com/billing");

const details =
  await itemService.getDetails(['ripe_bananas', 'walnuts', 'pecans' ]);

Adriana and Andre go into more detail in their Chrome Dev Summit talk –
What’s new for web apps in Play,
or check out the docs.

And more

And of course there’s plenty more.

  • To conform to a change in the HTML standard, anchor tags with target="_blank"
    will now imply rel="no-opener" by default, this helps prevent
    tab-napping attacks.
  • Most operating systems enable mouse acceleration by default, but that can be
    a problem for some games. In Chrome 88, the Pointer Lock API allows you to
    disable mouse acceleration.
    That means the same physical motion, slow or fast, results in the same
    rotation, providing a better gaming experience and higher accuracy.
  • And addEventListener now takes an Abort Signal as an option.
    Calling abort() removes that event listener, making it easy to shut down
    event listeners when no longer needed.

Further reading

This covers only some of the key highlights. Check the links below for
additional changes in Chrome 87.


Want to stay up to date with our videos, then subscribe
to our Chrome Developers YouTube channel,
and you’ll get an email notification whenever we launch a new video.

I’m Pete LePage, and as soon as Chrome 89 is released, I’ll be right here to
tell you — what’s new in Chrome!


Was this page helpful?


What was the best thing about this page?

It helped me complete my goal(s)

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It had the information I needed

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It had accurate information

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It was easy to read

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

Something else

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.


What was the worst thing about this page?

It didn’t help me complete my goal(s)

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It was missing information I needed

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It had inaccurate information

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

It was hard to read

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

Something else

Thank you for the feedback. If you have specific ideas on how to improve this page, please
create an issue.

Source link

What do you call this technique? (lines "growing" from a shape)

What do you call this technique? (lines "growing" …

What do you call this technique? (lines "growing" from a shape)

submitted by /u/Alolboba

Source link