The Claris FileMaker 19 release includes one of the most requested features from the Claris Community - the ability to embed JavaScript directly in your custom apps!
Now you can use packages from readily-available JavaScript libraries or your own custom code to modernize your apps with data visualization, maps, calendars and more.
Here are 5 useful JavaScript libraries you can use to enhance your apps.
1. Kendo UI: Enhance your User Interface
When was the last time you refreshed your app with an eye on the user interface (UI) or the even the overall user experience (UX)? While you may have spent a lot of time planning how users could accomplish functional tasks with your app, it’s easy to overlook UI as time passes. Simple design changes can be accomplished easily with JavaScript.
Easily add advanced UI components into your existing designs or take advantage of Kendo UI‘s comprehensive library. You can quickly add functionality to your app by integrating simple configurable React components with advanced data grid tables, charts, spreadsheets, schedulers, and many more.
This allows you to design an engaging UI for your end user, improving the presentation and interactivity of your app.
2. Quill: Add a rich text editor
Whether you’ve filled out a feedback survey online, used a chat window, or commented on a post, it’s likely you were using some form of text editor. In fact, most web applications these days include a rich text editor somewhere in their design. Rich text editors offer an interface to edit rich text or allow users to upload images, links, audio, and even video.
For example; a radiologist could submit a text-based report of his patient’s bone fracture and upload an visual image of the x-ray to the app.
If you’re looking to easily incorporate a rich text editor in your app, check out Quill. Quill is a free, open source WYSIWYG editor built for the modern web. Completely customize it for any need. Companies like Slack, LinkedIn, and Salesforce have adopted Quill in most of their user-facing products.
3. FullCalendar: Improve UI with a customized calendar
Nearly every business could use a calendar on their user-facing or internal apps. From letting customers choose a specific time and date for appointments to logging events, tracking logistics, or displaying time-sensitive tasks tasks, calendars are fundamental elements of an app’s UI.
JavaScript calendar components are essential in most modern apps and may even provide a great opportunity for you to instantly refresh the calendar UI in your existing app or add some new features.
With attractive layouts and functions, open-source JavaScript libraries such as FullCalendar give you an easy advantage. You can choose from over 100 customizable settings in a full-sized calendar that offers easy drag and drop features and customizations to make your UI even more engaging.
4. React Gantt: Add Gantt charts for project management
Gantt charts display project roadmaps and timelines for organizational transparency. When it comes to communication enhancements, forecasting projects, or tracking results, Gantt charts provide an array of benefits. They make it easy for users to schedule tasks, add dependencies, and provide a visual representation of project management.
Historically, the disadvantage of Gantt charts is that they were complex to prepare and manage, but that’s changed considerably in recent years.
Bryntum Gantt provides a library full of all the right features and a thoughtful user experience. You can even render timeline elements with your own custom template. Critical pathways, PDF exports, document imports, resource assignment, constraints, and many more features are at your fingertips with a copy and paste of some code.
5. Toast UI: Incorporate an image-editor
You may be thinking, “Why on earth would I need an image-editor on my custom app?” but surprisingly enough, image editors are critical features for professional institutions such as banks, schools, and healthcare organizations.
Let’s revisit the example of the radiologist uploading a patient’s x-ray through a custom app. The app securely links to the hospital’s patient information system via Claris Connect. As you can imagine, the x-ray file is rather large in its raw form, so the radiologist may want to crop the image and zoom in on the fractured area for a more precise visualization of the damaged area.
Open-source JavaScript libraries with full-featured photo image editors like Toast UI deliver a robust set of features that are easy to use. It enables basic image manipulation like cropping, rotating, flipping, adding filters, and more.
So there you have it! We cherry-picked 5 of the most useful open-source JavaScript libraries. There are thousands of free and paid options to enhance your existing custom apps. We hope you’re inspired to use any if not all these awesome components.
Your custom app, built on Claris FileMaker 19, can now evolve and grow endlessly. The latest release is also stacked with Core ML functions, Siri Shortcuts + AI, near field communication (NFC) tags, and more.
Want to enhance your custom app or build a new one? Download a free trial and start exploring!