For a while now, you have used and loved the Appsmith Debugger, nearly complete with a Error pane, system and error logs, and an entity inspector. We say nearly complete because it was missing one of the most popular debugging tools in a dev’s toolkit—console methods.
We are happy to announce the availability of console methods for both cloud users and self-hosters on v1.8.0.
Think of the Appsmith Debugger as a set of Chrome DevTools—like for Appsmith. It lives on the familiar 🐞 everywhere in Appsmith and
All of this is helpful when debugging unexpected API responses or app viewer experiences. Should you care to learn more, this post breaks down the debugger by each one of its features.
Just one of the most popular ways of print debugging in modern browsers, console methods, exposed by the console API, are a set of functions that help you log the values of variables at set points in your code, messages, or even tabular data so you can investigate them in your browser’s debugging console.
Before today, you could use all supported browser console methods, but only in the browser’s dev tools sub-window. To any developer with their hands dirty with front-end code, the browser debugging subwindow is a necessary evil—a thousand lines of errors, messages, values, and steps that you would have to sift through. We are not going to say, “Looking for the literal needle in the haystack”, but you know you are thinking it.
So, instead of something like,
you now see,
Sweet? This gets sweeter.
It can also be used to show helpful messages or comments, say, the entry and exit points of functions.
the .error() method logs an error message to the Appsmith console, be it a a string like, “This is an error message” or the value of a function.
Say you've written a function and you suspect it’s returning an error., but you don’t know what kind. For unknown unknowns like this, `error` comes handy.
Jus as .error() aids error investigations, .warn() shows, well, warnings for known knowns. Some situations this can come in handy are,- When the evaluated value of binded data on a widget is not using the same datatype as the expected value- When widgets continue to use deprecated queries or functions- When the timezone used in a datetime functions doesn't match the browser’s
table (.) just does what it says—logs a Table widget’s data in key-value pairs for rows as objects. While we support this in Appsmith, we are still working on a browser console-like table, especially as we make the Table feature-richer.
That’s it! You now have the power of the console right within in Appsmith. There are other useful views available under Logs and we'll talk about them in a follow-up to the Debugger teardown soon. Bookmark this page. Thank us later.
We have teased the availability of GraphQL CRUD operations inside Appsmith for more than a couple weeks now. And we are excited to announce it’s finally here!
Appsmith now natively supports both authenticated and unauthenticated GraphQL API endpoints with native GraphQL methods for querying your connected endpoints.
GraphQL is many things to many devs. For this feature, we will talk about GraphQL as it is understood most popularly—a query language and a runtime for your existing data.
While there was a way to use GraphQL inside Appsmith, it was not the easiest.
Given how popular GraphQL is with devs in general and those using Appsmith in particular, it was a no-brainer to ship native support as soon as we could, but we had to ensure we weren’t leading you onto tricky ground for connecting a datasource, writing queries, or getting variable names from widgets. Several careful considerations later, we are ready for the expose.
GraphQL inside Appsmith supports both unauthenticated—for single-use queries—and authenticated—for reusable datasource configs like the URL and params—API endpoints. To both endpoint types, you can,
☝🏾 We will assume you have created a new app—recommended in your Appsmith account—and have a ready GraphQL endpoint, e.g., https://api.github.com/graphql in the rest of this post.
GraphQL uses query to fetch data and mutation to write data from and to the endpoint.
☝🏾 GraphQL queries in Appsmith auto-indent, just like REST API ones.
☝🏾 Last preach. Promise. GraphQL relies heavily on the database schema exposed by the endpoint and query operations need to adhere to the schema to return expected responses.
Sorry, we started being preachy again.
You will see a Pagination tab under every GraphQL query, much like with a REST API, where you can choose from one of two supported pagination methods in Appsmith.
Your choice of method will depend on the GraphQL implementation of your endpoint. In our example, we have used the GitHub GraphQL endpoint which supports cursor-based pagination.
We are pretty excited for GraphQL in Appsmith and can’t wait to see how you use the feature for your apps. You can’t wait either to get your hands on it?
We look forward to learning from your experience, closely listening to your feedback, and informing our roadmap. Here’s what’s coming down the pike.
A GraphQL schema explorer like GraphiQL
Auto-complete for GraphQL schema attributes and fields
Multiple GraphQL queries in the same request body
Day before yesterday we reached 20,000 Stars on Github.
We’re excited by this number because of what it represents. 20,000 Stars is a milestone that puts us in the company of other exciting open source projects that we all use and love.
It’s been a steady rise. Since our launching on Github in mid 2020, it’s taken us a little over 2 years to reach this milestone. In June last year, we wrote about our learnings while hitting 4500 Stars. Since then, we’ve gotten a 4.4x jump since.
There’s a big debate in the open source community around the value of Github Stars. One Stack Overflow question laments "GitHub Stars" is a very useful metric. But for *what*?
We look at Github Stars as an informal measure of popularity of an open source project. And so while there might exist popular projects with low Stars, projects with high Stars more often than not command some mindshare.
So while we keep an eye on this metric, it’s definitely not something we lose sleep over.
Our philosophy has been to focus on things that add value to developers worldwide and focus methodically initiatives that further that cause. And so here are the things we’ve been doing (with pride)
We’ve been shipping. A LOT. And it's getting noticed. The folks at OSSInsight have been tracking and ranking various open source projects. We've submitted the highest number of pull requests among all low code development platforms. What makes this more interesting (and exciting) is that the definition of a low code platform according to OSSInsight is quite broad, including companies like Hasura, Supabase, Strapi.
And Appsmith continues to lead this chart month over month.
Our users are noticing this too.
In addition to new users discovering us from word of mouth, we’re also seeing a lot of existing users returning back to Appsmith citing how much better the platform has gotten since they last tried it.
Even though our primary aim has been to educate our users about new features releases, bug fixes and helping users create bettet software, we started noticing that a lot of developer media began picking up our updates. This was very exciting to observe. Devops.com covered our version control, New Stack highlighted our OSS approach, JAXenter covered our JS Editor launch, and SD Times featured us not once, but twice as their Project of the Week (the second time was probably due to our fundraise).
We made a conscious call in 2020 to focus on retention and user education over user acquisition. The good folks at Threado covered our early community-building efforts some time back.
We believed as long as we served users via solving bugs, prioritizing features they asked for, and making ample content to help people get the most out of the platform, word of mouth would take care of acquisition.
We launched our discourse community to create a Q&A type knowledgebase. In addition to helping our existing users and reducing load on our support team, it’s also becoming a growing source of organic traffic and bringing in new users (plausible data only from Apr 22)
To increase retention, we also created Sample Apps, and Templates to help users understand product features better. While Templates enable a user to see a fully functional application that’s ready to be forked (like a dashboard or admin panel), Sample Apps have a narrower scope to help users perform a specific functions like How to implement a Search / Filter functionality in a Table with MongoDB as a datasource. This is in addition to the videos and blogs we’ve been regularly publishing around use-cases and investing in robust documentation. We’re slowly seeing the fruits of this from a new user acquisition perspective kick in because this type of content is also great for SEO.
One of the early calls we made was to ensure that we made it easy for people to self-host Appsmith because that's how a lot of our users preferred using the platform. This is also reflected in our outreach efforts; you might see us plugging in links to our Github repo often (more so than website). The self host option is also prominently featured on our website's “hero section”.
We've been actively answering questions and sharing our feature releases on Reddit, Twitter, HackerNews and community forums of our integration partners. None of these channels individually bring a massive spike to traffic, but instead send a steady stream of consistent traffic to us every month and brings in a lot of new users to our Github repo. Like our July updates which is being received well from the Reddit community.
While our team continues to actively monitor and post our opinions on these platforms, increasingly we’ve started noticing that our users have started talking about us. For example, user comments on HackerNews like these make our day. All in, across Github and our website, 3rd party forums are increasingly contributing anywhere from 4-6K unique hits a month across our websites and Github.
A lot of our users are also writers, empowered by platforms like Medium or Dev.to or Hashnode and many of them have started featuring us in tutorials or listicles. This has lead to a massive spike in traffic, and my hunch is increasingly becoming a big contributor to our star growth.
For awareness, we had to be surgical. Instead of spending effort on SEO or ads, we decided to go after podcasts. Why? Laser focused target audience that resonates with the problem. Check. Organic backlinks. Check. Ample time to go deep into product, technology and how/why we’re building. Check. People who know what they’re talking about (our founders basically). Check. Till date we’ve recorded 15 podcasts (with 11 of them live) with an estimated cumulative 100K listens. All this in less than a 6 months. Check out Nikhil on JAMStack Radio or Arpit on Hanselminutes.
As a parting note, this is just the start. And we can’t wait to see what the future holds and we’ve got so many exciting features we’re working on (and yes bug fixes too). We’ll keep executing and serving our users. Do try out Appsmith incase you haven’t already or share it with developers in your team. Want to get more involved? Maybe contribute to the project or better still, join us if you want to be a part of an organization that is building something meaningful for developers worldwide.
In July, we squashed 102 of the peskiest bugs and shipped 34 top requested features over and above under-the-hood performance and usability improvements. There’s a new table widget that’s so much more powerful, an Airtable integration, and cleaner Google Sheets queries with 178 commits in 22 days just for that enhancement alone! You can tell we have got our ears close to you. Keep it coming, guys. We love it all, and we are always listening.
Fact: Just 25% of you tell us who you are and how you use Appsmith. We are okay with that. We respect your privacy.
Assertion: Our usage numbers should be 4X more.
Inference: When we say the Table widget, ever since we launched it, has been used a crazy 820,000 times by 6,840 users, we actually mean it's been used a lot more and is second only to the Button.
Takeaway: Give it more love.
Everything you asked for from the table and more is packed into this massive update. Here’s three that should make you sit up.
There’s a whole lot more that you are going to have to see for yourself.
Our Airtable integration gave UI facelifts to the low-code datasource. It is now out of beta, ready for its moment in the sun.
Connect with a Airtable base in two minutes, and start building your apps without worrying about complex data workflows.
Oh, okay. You are still here. Fine. We will show you.
Automatically pretty code is pretty cool, huh? More about it here.
Infuriating little things, error messages, that bring up existential questions, right? And when they showed up all the time, they got us to, “Frustrating!”. They don’t anymore, only showing up when a widget is visible and clicked.
Got your Appsmithing going, but a paid feature’s in your way? Fret not, self-hoster. We got your back with a command-line feature that estimates your usage in thirty seconds. Click this and all shall be revealed.
With something like ./scripts/local_testing.sh chore/local-testing, running any branch as a FAT container is a breeze. Make sure Docker’s installed and running, port 80 is open, and you add arguments if you don’t want to run the release branch.
Two new modules, logger.js and mailer.js now store backup errors and alert you to them—helpful to get you on top of the error and aid find-and-fix.
While logger.js is on by default, mailer.js needs appsmithctl backup --error-mail to get humming.
Just two of the many, many ways we got your back(up).
Google Sheets is a popular data source. We didn’t dig up numbers, but you can take out word for it. UQI stands for Unified Query Interface and affords standardization for queries. Made sense to get queries to Sheets working better and looking neater, too.
If wishes were fishes, round-ups would be essays. Wishes aren’t fishes. So, head over to v1.7.9 if you closed our Release Notes in-app pop-up one of four different ways—yeah, we are fixing it—and see What Happened In July Appsmith style.
Today, our integration with Airtable comes out of beta and is available for everyone 🎉! You can now build custom UIs and interact with applications built on Airtable, with minimal configuration.
While it is possible to use the default API interface to connect to Airtable, we wanted to make it easier for you to directly connect your Airtable account and create applications faster than ever. This new data connector introduces a number of features:
For details and information on how to use this new integration (with videos!), check out our Airtable documentation here. See it in action on our full tutorial here, where we build an issue tracker with Airtable as backend. As always, let us know what you think!
TL;DR: We just raised $41m in our Series B, led by new investor Insight Partners, alongside Canaan Partners, Accel, and angel investors.
Frontend and backend development for simple applications have become incredibly complicated. It feels like we are building the same things repeatedly but just using different programming languages. The world has about 20 million software developers; most have spent hours building admin panels, forms-based workflows, dashboards, or some version of a CRUD app. That's billions of hours spent building internal apps and doing a lot of repetitive and mundane work.
My co-founders, Arpit and Nikhil, had spent many years building CRUD apps and were tired of dealing with the same problem at every company. There had to be a better way to build these apps. We decided to release an MVP to a small community that embraced Appsmith with wide-open arms.
We started Appsmith with a simple goal: To help engineers build the best apps they can to help their teams while avoiding repetition and monotony.
I am happy to announce that we've raised our Series B to deepen our commitment to that goal.
The lead investor for Appsmith's Series B is Insight Partners, joined by existing investors Canaan Partners, Accel India, and angel investors like Abhinav Asthana (Co-founder, Postman) and Jeff Hammerbacher (Co-founder, Cloudera). Our goal was to bring investors that understood the technology landscape well and were impressed with Insight's track record of backing companies like Docker, Postman, and JFrog, many of which are also open source. As we spent more time with the Insight team, we realized they would be the right partners for us as we scale to the next level.
And of course, a big mention to our users and community. We're only here because you decided to take your valuable time in using, giving feedback, and contributing to the core product.
Today, Appsmith is a robust open-source, low-code platform for building, shipping, and maintaining internal tools. Users can connect to any datasource, create UI with pre-built widgets, and deploy business-critical applications.
You can see it in action:
Our focus last year was on improving the quality and complexity of the frontend that can be built using Appsmith, a couple of examples of which is our latest theming feature or our in-built JS editor is an excellent way to code. These are a few among the 150+ features and enhancements we shipped in 2021.
Over 100,000s developers have used Appsmith for personal and professional projects so far. We see over 7,000 active teams daily relying on apps built quickly on Appsmith. We developed a 3000-member strong Discord community and helped our users build over 100,000 apps. From providing rich support to writing detailed tutorials to contribute valuable integrations, our community and team are the heart and soul of Appsmith. We have loudly and proudly built Appsmith in public and honestly believe transparency and community involvement help us in the short and long term.
Now, it's time we make it happen for dynamic apps starting with internal apps as our focus.
With this round of funding, Appsmith will build on the progress from 2021.
Here's a five-point plan for the coming year:
As I mentioned before, this accomplishment wouldn't have been possible without the love, care and support from our team, community, families, and friends.
I want to thank you all again for your continuous support and assure you we don't take it for granted.
Today we're excited to announce the launch of Version Control with Git, so that developers can collaborate and version control their applications. This has been one of the most requested features from our community.
While low-code frameworks like Appsmith save a developer's time via easier application management, faster plugging in of data sources, and effortless creation of UI, there are still aspects of a developer's usual workflow that aren't native to low-code platforms.
Version Control with Git, enables us to take a big step towards that.
Here's a short video on how you can use Version Control with Git:
Version Control with Git allows multiple developers to add their work in a git branch, raise a pull request for code reviews, integrate with CI/CD pipelines so that their changes go live when their pull requests are approved, and provide a commit history to go back to a previous version if something were to go wrong. You can now also test a new addition to your app on a separate branch without breaking your deployed version.
You can connect to any popular version control tool of your liking: Github, Gitlab, Bitbucket, AWS Code Commit and more.
Furthermore, if you're a large organization using isolated environments for your production and test apps, you can now ensure that your applications can only be promoted to production via your CI/CD processes.
Appsmith's Community Edition users will be able to connect unlimited public repos and up to 3 private repos.
In contrast, low-code frameworks in the market today either don't offer this functionality as part of their open source or free edition (and instead offer a simple auto-save), or push it deep into their most expensive pricing plans (like Retool).
Head over to our Version Control with Git documentation on how to set up version control with your favorite version control tools and get the most out of it.
Forms are a core part of most internal tools since its one of the major ways in which data is created or updated. Today, we're introducing the JSON Form Widget (documentation), which allows for a fantastic form creation experience and has been one of our top requested features.
The JSON form widget is helpful for quickly generating (dynamic or otherwise) forms from JSON fields.
Here are some highlights of this widget:
Once you drag a new JSON form widget, you will see a default form rendered with some details. You can update the source data field to infer data and then generate the form. This can be bound to any query or variable containing JSON data, such as DB queries, APIs, or JS Objects. The JSON Form widget can be bound to any other widget in Appsmith as well.
The form fields are generated according to the source data when you enable an auto-generated form. Fields are generated according to the key-value pairs in the source data. Whenever there is a change in the source data, the form fields get updated automatically.
Field configuration shows all the fields generated automatically in the forms. You can edit the fields to tweak properties like the field type and default value and bind specific actions by using editable properties. Most fields use the underlying data type-specific widget's properties to allow a full level of customization just like the widget would. For example, if the input type is text input, the editable properties are similar to the input widget in Appsmith.
Some of the ways that we've seen our users use the JSON form are:
Note: It’s live on the cloud app and will be live on the self-hosted version very soon.
Today we’re launching Templates, an easy to use, ever-growing forkable library of pre-made applications across use-cases that speeds up onboarding for new users, and makes application development faster for existing users.
You can access templates on our website as well as inside your Appsmith dashboard.
Here’s what you can do now:
And here’s what we have in store for the immediate future:
Today, templates help you kick start an application from a blank canvas. But with V2 (launching in a month), you can add templates to an existing app.
We plan to add new templates every week, and are always looking for more ideas. If you have an idea for a template, you can create a GitHub issue.
Control the styling of all your widgets globally from a single place, helping you build amazing visual apps with just a few clicks.
💡 Pro-tip: Templates are also a great way to get buy-in from your team to adopt Appsmith. You can quickly show the templates to your colleagues, team leaders, or even the CEO and quickly give them an idea of the power of low-code.
We’re so excited to be launching templates and can’t wait to see what you do with them.
It's time for a quick look back on all the stuff that we did in the last 30 days! You know we like to work hard! 😎 We shipped many features, fixed bugs, and hosted some fun events with our community.
We've always strived to be a developer first product, so this is an emotional moment for us on our journey to becoming bigger and better. While it's possible to write JS on Appsmith in the small input boxes on the property pane, as fellow developers building a developer-first product, we know all too well the challenges that come with such an experience. Especially when writing vast chunks of code for transformations, logic, and action-based workflows. So we shipped out a full-fledged JS editor on Appsmith. Here's a quick sneak peek of our all-new JS Editor:
Users can now write full-fledged JS objects to create functions and variables across Appsmith and re-use them. Building this new module was challenging and involved multiple iterations, designs, and vigorous testing. The JS Editor is currently a beta feature, and we can't wait for everyone to use it soon!
Read this blog if you'd like to know more about this feature and why we built it.
New Button Groups Widget: Button Groups is the latest addition to the Appsmith widget family! The buttons are no longer alone on Appsmith. With this new widget, you can create simple buttons or menu buttons with drop-down items. This widget can come in handy when you require a header or perform specific actions on various button clicks. Of course, this widget is also heavily customizable; you can add different styles, add icons, and provide other options under a menu. To find out more about all the things you can do with it, check out the documentation!
Make All Apps Beautiful Again: At Appsmith, we work very hard to provide the best developer experience while building their internal applications with our platform. This month, we had spent a lot of time making things look much better and consistent; these could be minor changes like updating font sizes, increasing paddings, having consistent background colours, etc. But for us, everything matters, and every widget is treated with equal importance; these are consistent, feature-rich, and are tested thoroughly.
SPELING mistakes? We'll Check It! : Even the mighty have fallen with just one spelling error! Our input widget is now loaded with a new superpower! Now it can detect spelling mistakes while in Editor Mode and Preview Mode. This is all thanks to Mozilla's HTML API! To use this, be sure to toggle the Spellcheck property on the input widget.
Fixed Issue on selectedRow property while a: First up, we had fixed a small glitch for the selectedRow property on the Table Widget while using the multi-select row option. Now, the selectedRow property considers the last selected row to be its selection while selecting multiple rows on your Table Widget.
More accurate and faster pagination on Table Widget: While binding significant responses on table widgets, our new performance upgrades will make the pagination experience smoother and faster. Not just that, we fixed all bugs that led to displaying the wrong page numbers.
No More Additional Region Configuration on S3: Currently, we have a region selector in S3 data sources, and the bucket is selected in S3 queries. This is very confusing since our query fails if we selected region-A in the datasource and it turns out our bucket is in region-B. The mental model breaks here because S3 buckets can ever belong to one and only one region. We have shipped a new feature that automatically detects the region from our service provider to avoid this!
Better Embedding Experience: While embedding Appsmith applications on the web, you can use the embed=true parameter to remove the Appsmith header. However, while navigating through pages inside the embed, the navbar comes back again! The embed=true parameter has now been retained with our latest upgrade. With this, hiding the Appsmith header on embeds can be done in a matter of seconds!
Generate Page Feature for S3: The one-click generate page feature is an awesome feature on Appsmith! With this feature, you can build a CRUD application within a single click by selecting a particular table on the datasource. Now, we have extended support for the S3 datasource to generate CRUD pages on Appsmith. You can now view and select buckets you'd like to create a CRUD page with this.
Dynamic Inputs in the URL field: Managing an entire fleet of Google Sheets? Don't worry; we got you covered. While working with Google Sheets integrations on Appsmith, you can dynamically pass the Sheet ID on the URL property. You can manage multiple Google sheets and perform operations like read/update at runtime with this. Super cool, right? Do check it out and let us know your thoughts!
By the way, I wasn't kidding when I said we were working hard. This blog isn't finished yet. Next up, I'll talk about cool new educational resources and collaborations!
We've published some cool tutorials and videos and hosted a few fun events!
One last thing, we were able to pull off an incredible event with our friends at Appwrite! Appsmith and Appwrite make an amazing open-source duo for business applications. We built an excellent authenticated dashboard to manage a database with Appsmith as frontend and Appwrite as backend.
Thanks to Matej from Appwrite and Confidence from our team, who successfully built everything live. We thank the entire community for all the positive responses and feedback!
We've got a host of other bug fixes and updates too, be sure to check out our release notes here.
What’s better than some space? More space. We’ve cleared out the clutter and developed a brand new full-fledged code editor to make the coding experience on Appsmith smooth like butter. Our Github repository is home to many feature requests, and whenever we ship out a new feature, it’s cause for a mini celebration 🎉.
In this blog post, we will discuss our efforts to ship this much-needed feature and how you can get the most out of it.
It’s hard for any developer to write code on this small property pane, and code reusability was also not possible. However, the input editor on the property pane still served its purpose well, with its excellent auto-complete, slash commands, linting, and debugging features. However, we take developer experience seriously and constantly work towards improving it.
We began the shipping process for the JS Editor around mid-July 2021. As strong proponents of building in public, we posted all the design previews, issues, ideas on our community channels and took community feedback into account while making this feature.
Appsmith has a highly modular code-base, so adding new widgets, integrations, and custom styles are easy. But, for a new feature like the JS editor, things needed to be stitched from scratch. Our engineers and product folk brainstormed multiple times before getting started on it to ship a scalable solution around this.
Here are a few thinking points that we started with:
This would enable us to create a robust feature that everyone would love and give the same freedom as any standard coding framework.
Appsmith's JS editor is quick and easy to use, and it lets you create objects with a single click. Just open the application, search for JS Objects from the entity explorer (left sidebar), and click on the + icon. We will be navigated to a new file, as shown in the screenshot here:
Here, myVar1, myVar2 are two variables, and myFun1, myFun2 are two functions defined in the JS Object which are exposed in default export. Currently, we don’t support exposing functions using named exports. Now, let’s define a new random variable and try to access it onto a widget, for this, update the Code contents of JSObject1 to the following:
To test this function, use the run icon from the appsmith console below:
And voila! Just like that, we should see our output; in case of errors, the console will return all the instructions options that will help you debug the issue.
Now, click on the + icon next to widgets and drop a new text widget onto the canvas. Open the property pane of the text widget by clicking on the widget name, and update the text property to the following:
Now click the + icon next to widgets and add a new text widget onto the canvas. Open up the property pane of that new text widget by clicking on its name and updating the Text property to:
With this, we should be able to see a new random number bound onto the text widget:
Not just that, we can see all the logs; we can also see the history of each update and execution of your function under the Logs tab.
Following are a few features, we will be extending to the JS Editor, keep an eye our, or join us on Discord to stay up to date :)
We hope you’re as excited about the JS editor as we are. If you’d like to give feedback on this feature or have a say in the roadmap, join the Betasmith program today.
We often see many questions in our community forums and discord channels seeking help with binding nested APIs, write data transformations, configure chained actions. Hence, we thought of building a library of snippets inside Appsmith applications that you can use directly and customize based on your data source.
Initially, we thought of the issue in a straightforward way, but at Appsmith, we always like to go the extra mile. So, we brainstormed this idea multiple times and decided to extend it to customize and add snippets particular to widgets and data sources. But, in order to do this kind of customization, we need a database application that validates and filters these snippets. So we built an internal Appsmith app that manages all the JS Snippets. This is how the application looks like:
Here, as we can see, on the left, we see a list of all the available snippets today. When these are clicked, we will see the details of the snippet and have options to verify it and publish it live directly to the JS Snippets library.
To customise these snippets, we define three formats for each of them.
Here’s an example of how we ideated customizable JS snippet using these three forms for merging two queries in a table:
Here’s a screenshot of how the snippet is rendered on Appsmith:
Users can now directly copy this snippet onto the widget, or customize the arguments, test it out, and use it in the widget.
We can find JS snippets inside the Appsmith applications from Omnibar. Click on the Search/Omnibar from the top navigation and choose the `Use snippets` option. Here, you can filter snippets based on data sources and UI widgets.
The other easy way is to access snippets from the slash commands. Just type in / inside the bindings, and choose the insert snippet option.
Hope you’ll build some super cool applications using the JS Snippets on Appsmith! If you do, don’t forget to tell us about it, we would love to feature your work! Your contributions and feedback help us make Appsmith better and we really appreciate it.
The quality and value spec is incredibly high when you have a like-minded yet diverse community working together to solve a problem. It is the spirit of collaboration to solve problems that drive open source projects. With open-source, failures can be seen as important milestones to improve as they become moments of learning from the community. Help, resources, perspectives that are beneficial for the community are all available in the open-source world. This is why Appsmith will remain forever free and open-source.
Every year, we look forward to Hacktoberfest because we find it an excellent way to get to know our growing community, and we hope that you find a few issues that you would like to fix, and get to know our product and society better.
Of course, participating in the Appsmith Hacktoberfest can also help you win some swag! In this blog, I am going to help you get started!
Hacktobefest is an annual month-long celebration of open source. It is an excellent opportunity for everyone, from seasoned developers to students, code newbies, technical writers to UX designers, to contribute to open source communities. At the same time, they can develop skills and stand a chance to win limited edition swag.
Before participating in Hacktoberfest, make sure to register on the official DigitalOcean Hacktoberfest site here.
One of our community members wrote an in-depth review about Appsmith; check it out here to better understand the framework.
You are welcome to contribute to the issues on Appsmith’s repository on Github. Before raising a PR, please read our contribution guidelines, review, and merge policies.
To participate in Appsmith Hacktoberfest, make sure you register before raising a PR to Appsmith; this will allow us to track your PRs and ship the swag to your location! Before working on any issue, please ask maintainers to get it assigned to you. Start working on it only after the issue has been assigned.
If you are new to this process and don’t know how to raise a PR, here’s a list of resources to help you get started:
Below, we put together a brief on the various issues of different specialties (engineering, code, content, templates, etc.). However, you are free to wander around the Appsmith Project and take on any current issue or open a new issue that you think is important.
We have a bunch of good-first-issues for Hacktoberfest that are labeled frontend, bug, and many more. You can pick from these based on your interest or expertise and can start working on them. If you need help understanding the issue or have any other code-related questions, chat with us on the Discord channel.
For setting up Appsmith and understanding git workflow, refer to this guide.
> Before raising a pull request, ensure you have submitted a related issue and discussed a plausible solution with a maintainer. This gives your pull request the highest chance of getting merged quickly.
Help improve our documentation and how-to guides! We’re always looking for developer experience for Appsmith, and we believe documentation is one of the core assets. If you are a newbie contributor, this is a great place to get your feet wet with Appsmith. We’ve prepared a list of newbie-friendly Hacktoberfest issues ready to be tackled.
I urge you to go through documentation guidelines and get the maintainers to assign it to you before you take up any issue.
Here are some of the examples for good contributions:
There are endless tutorial and blog ideas for creating internal applications, admin panels using Appsmith! From simple store catalog manager to complex Postgres admin panel, everything is possible. So far, we’ve made more than 20+ dashboards and admin panels to help developers build internal applications.
We believe the Appsmith community is more than just code! For Hacktoberfest, we are considering tutorials and blogs as valid contributions.
These need not be assigned to you; all you need is to join our discord channel and post your idea in the #hacktobest channel.
You can either publish them on your blog or submit it for publication to the Appsmith blog. Lastly, do not forget to raise a PR on the awesome-appsmith repository, so this contribution is valid towards the contribution amount for both Appsmith and DigitalOcean events 😊.
Take a look at these Tutorials and Blogs to get an idea about what we’re looking for:
Create video tutorials to help our new community members get started with Appsmith!
It can be anything! How to deploy Appsmith on Linode, use the Google Sheet integration,o work with GraphQl APIs, build a Shopify/Ebay backend on Appsmith... The sky is your limit. Also, it can be in any form! Your recorded video can be uploaded to Youtube, Twitch, or other streaming services. As long as there is a record, we will accept your submission.
Take a look at these video tutorials on our Youtube channel to get inspired!
Raise a PR on awesome-appsmith repository, so your contribution is valid towards the contribution amount for both Appsmith and DigitalOcean events 😊.
Help us build excellent forkable admin panels, dashboards, CRUD apps with Appsmith for Hacktoberfest! On Appsmith, it’s super easy to fork any application based on the user permissions. We’re creating an incredible library of templates that will benefit our community.
Here are some of the templates we’ve built:
Raise a PR on awesome-appsmith repository, so your contribution is valid towards the contribution amount for both Appsmith and DigitalOcean events 😊.
If you’ve got any questions, ping me on Discord or send me an email (firstname.lastname@example.org). We’ve also listed some more FAQs on this page; please do go through them.
Time indeed does fly because it feels just like yesterday when we hosted our first ever Hacktoberfest last year! And what a year it has been.
We started Appsmith because we wanted to create a developer-first product to make an engineer’s life easy. From being a small, little-known project on Github, we now have 5K stars. This wouldn’t have been possible without our community; apart from giving us incredible feedback, they also contributed immensely to our codebase, from contributing new integrations to helping solve bugs. We now have over 100 contributors, and we want to expand our community (that means you!), empowering them to contribute to a project that will always remain developer first.
And so, we’re back again this year for an exciting month-long virtual festival supporting open-source projects. We love it because it’s celebratory and community-oriented! At Appsmith, we genuinely believe open-source can take the way we build things to new heights. And our commitment to the community will never waver.
In that spirit, we are kicking off the Hacktoberfest 2021. In the run-up to the actual code-fest, there are going to be many talks! We will be bringing together folks from other awesome projects to talk about Hacktoberfest and Open Source. Be sure to check these out. You will definitely get to learn more about how to get involved in open-source projects. And yes! We’re ready to swag it out, too, for every valid PR! And contributors who submit more than 4 PRs and invite others to contribute to our repository will get a special prize. You are welcome to contribute to the issues on Appsmith’s repository on Github. Be sure to check contribution guidelines, review, and merge policies. Please note that not all pull requests will count towards Hacktoberfest 2021.
Contributing to open-source projects is an excellent way for users to become contributors. And it’s both a fun and rewarding experience. Sure, it can be scary to begin, and many think that only code that implements significant features matters. Well, I am here to tell you that it’s not true. We believe that no contribution is too small. Bug fixes, documentation updates, submitting articles are all fantastic ways of participating.
Hacktoberfest is open to all: Students, developers, anyone really. Background no bar. To this end, this year, we’ve included several newbie-friendly issues in the challenge to give a warm welcome to first-timers.
If you’ve still got some doubts about participating or need some queries answered, head over to our Hacktoberfest channel on Discord, and we will be happy to help you out! To know more about how you can participate in this event, take a look at our Contributor Guidelines and Code of Conduct.
Happy Hacking! 🐱💻
Editor's Note: We have paused the form for new applications for the writer's program. If you wish to contribute, please send an email to email@example.com along with a brief outline of the topic you wish to write on, links to two writing samples, and mention your areas of interest/expertise. Please note that we receive a high volume of emails, do allow us some time to get back to you. Be assured that we will do our best to get back to you in a timely manner.
Are you an engineer who enjoys creating content and sharing your knowledge with the world? We'd love to talk to you!
We've been creating a lot of content at Appsmith over the last few months for our growing audience of developers to educate them and share our knowledge with them. You can check it out on our Youtube or our blog. As an open-source project, we don't just want to share our codebase with our community but also our collective knowledge.
At Appsmith, we want to work with engineers who love writing or creating videos. Whether you're a veteran of the trade or a young student just starting out, we'd love to hear from you.
And of course, pay you for the work you do.
All that we care about is whether you can write in-depth and in detail. We're looking for long-form pieces which help educate our community (1500 words and up).
We don't care about your style and grammar. We've got a great editorial team to help with that.
Yes! We pay anywhere between $200-$400 for content created (video, templates, blog posts, tutorials).
Below are the types of content we're most excited about:
Blog Post / Templates
If you want to write an engineering post that could be relevant for Appsmith's audience of backend developers but not directly about Appsmith (for example, this), we'd be very excited to discuss those too.
If your proposal is accepted, we’ll feature it on our website with your name and share it with our rapidly growing open-source community.
These videos can fall into different categories:
If you want to have an ongoing engagement with Appsmith, where you want to create Youtube videos on broader engineering topics (not directly related to Appsmith) on the Appsmith Youtube channel, please do reach out as well; we can figure something out.
The best way is to fill our form to share an outline, and we can take it from there. (Note: We're going to only consider previously unpublished content)
If you're keen on exploring this opportunity but don't have a clear idea of what you'd like to write, we're happy to help! Just mention this in the form, and we will get back to you ASAP!
We’re thrilled to launch Betasmith: The Appsmith Beta Community .
Since our inception, we’ve relied on the community to help us decide what to build. With Betasmith, we want to involve our users even more deeply in our product development process.
Do you want to have a say on the future of Appsmith? Do you like the idea of sharing ideas to help shape the future of the product? Or maybe even be the first to test out our new features?
Well, we’d love to hear from you.
What's more you'll gain access to our previews and be able to take part in private interviews and other treats along the way. You can be a part of our Beta Community from anywhere in the world.
What can you do as a community member?
💬 Give feedback on early design concepts and prototypes. Sit back and be the judge of the future.
✏️ Participate in research sessions and workshops. Chat directly with our talented designers
🤐 Get early access to new feature previews and demos Who doesn't love being the first to get a new toy?
Ready to sign up? We can’t wait for you to help shape the future of Appsmith. Sign up here
You have been asking for it, and we have developed it! The import-export feature is now out in the latest version (>v1.5.4) of Appsmith. With this, you can easily migrate apps from your self-hosted environment to Appsmith cloud or vice-versa.
At Appsmith, our users develop internal applications on the cloud, self-hosted installations, or even on local environments on their laptops, and it’s a pleasant experience in all cases. However, when looking to move the app from one environment to another, the only option was to rebuild applications… until now!
We’ve been asked multiple times on our community platforms for a quick way to migrate applications.
And then, we’ve created a feature request on GitHub!
Today we proudly ship the import-export feature to our community. With this feature, you can export the application as a JSON file and import it to any development environment in just a few steps.
We limit this functionality to only the organisation’s administrators to ensure that your database credentials, etc., do not get exposed to all the developers.
Want to try this out? Let’s see how mind-bogglingly easy this is!
On your dashboard, open the overflow menu of the application you want to export from the source environment. Select the export option from the menu. This will download a JSON file with all the information about your application.
Choose the organisation you want to import the application from the dashboard to the destination environment. Open the overflow menu by selecting the organisation name and select import. Upload the exported application JSON file.
Awesome, in just two simple steps, you should be able to migrate your Appsmith application!
Special credits to @abhvsn, who had worked hard on getting this feature out!
Today, we are super proud to announce Snowflake DB integrations on Appsmith in our latest release (>v1.5.5). It was one of the highly requested integrations by our community, and we've shipped this right on time. This blog is an attempt to share with you our motivation and experience in building this integration.
We first received a request for this SnowflakeDB integration on our GitHub Issues. This was posted by one of our community members in the last week of April. We then researched SnowflakeDB's architecture and data sharing capabilities and decided to supercharge it with Appsmith for querying and building applications.
On Appsmith, it's super fast and easy to build new Integrations. This is because we've architectured each integration as an individual module; with this, it's super handy for us and contributors to build, customise and organise any new integration.
To learn more about Appsmith's backend architecture, we recommend you watch the session about integrations by our co-founders here.
Considering the amount of interest this integration had gathered within our community, we decided to fast-track the work on Snowflake DB Integration. It barely took us two weeks to build, test and ship it to production. Super C❄️❄️L, right?
Our existing integrations helped us organise most of the code, and with Snowflake DB's JDBC driver support, we were able to establish a connection with our backend quickly. We've made a few easy-to-get-started decisions on the UX front, but we'll enhance these based on feedback from our community.
It is super easy to connect databases with our integrations on Appsmith. Now, let’s look at how we can connect SnowflakeDB on Appsmith to build applications.
Step #1 Find Snowflake DB Integration under Datasources
Step #2 Add connection details for SnowflakeDB and save a data source
Step #3 Create Queries and Build UI
Awesome, in just three steps, we're able to connect to SnowflakeDB on Appsmith! Now we can power UI widgets with queries from the created data source.
Credits to Nidhi Nair, who had worked hard on getting this integration out!
We’re excited to announce the new iFrame widget on Appsmith’s latest release (v1.6). With this, we can now embed content from other sources, such as web pages, videos, and scores of other content formats on Appsmith applications within no time!
At Appsmith, as an open-source organisation, we believe in the power of community and take member requests seriously. It’s also a part of our commitment to building in public. This iFrame feature was highly requested by our community members, prompting us to create an issue on our Github repository.
Today, we want to talk a little bit about how we got to prototyping and then delivering this widget.
First, we listed the basic requirements for an iFrame widget and the other specific functionalities we wanted to include. And yes, all the ideation and prototyping are open to the public; you can check out the Figma files! One of our contributors, Paul Li, volunteered to build the widget. Li’s submissions were then thoroughly tested on our deploy previews and then pushed into production. A working example of the collaborative engineering practices we follow here at Appsmith! 🙌
In case you’re wondering about how to set up Appsmith in the local environment and start contributing, this detailed guide will help you!
You can add the find the iFrame under the widget sections from the entity explorer inside the application. Drag and drop it onto the canvas to use it. By default, you’ll see a Wikipedia webpage, and you can change this by opening the property pane and adding a new link to the ‘Source’ property. You can also update the ‘label’ property to assign a name (title) to the content page that you wish to embed.
The iFrame widget will allow you to trigger a value when a message event is received. This can be handled by configuring the onMessageRecieved property.
Here’s how it works:
In the future, Appsmith will also provide an API that will let you access the message received from the iFrame embed.
Here is another example with a similar use case. When the developer provides auto-login to another website that they have embedded inside their new website.
Note that the control of the embedded website is paramount here and also this approach is insecure. We have allowed this assuming that the developer understands the security issues and deals with them appropriately.
You can handle certain actions when the Widget’s URL is changed using the onURLChanged property.
Here’s an example:
Let’s say you have loaded user data in the table and want to display details from there onto the website. When you click on a particular row on the table, you can change the iFrame URL to show the rest of the details on your own website using the onURLchanged property. We can also bound a trigger to execute an action whenever the URL is changed.
Hope you’ll build some super cool applications using the iFrame widget and Appsmith! If you do, don’t forget to tell us about it, we would love to feature your work! Your contributions and feedback help us make Appsmith better and we really appreciate it.
Most apps on the internet are actually CRUD applications. What this means is that any basic app does the following functions: Create, Read, Update, and Delete (CRUD). In fact, if you look at Twitter, it’s a simple CRUD app where users can create tweets, read tweets, update tweets (like re-tweets) and delete tweets! CRUD apps are used on a daily basis by several businesses and organizations to maintain their day-to-day workflows. For example, in an enterprise organization, HR departments would be using a CRUD application to manage staff and keep track of existing employees.
Well, at Appsmith, we know how important CRUD applications are for internal operations. Why should something so critical to an organization's success be difficult to make? Well, we took matters into our hands and we made it super easy to make one. What if we said that you can now make the entire CRUD application with all the UI, logic, and complete control in just one click? Yes. You read that right!
We’re super excited to announce our new feature called the “Generate New Page from Database” With this, you can build CRUD applications within no time. We’ll discuss a bit more about our approach in shipping this feature in this blog, and also talk about how you can use this feature on the Appsmith framework.
The idea of the “Generate New Page” feature is rather simple, we wanted to ship a feature that would help developers save time in building UI and writing queries for basic CRUD applications. Now, all that users have to do is just open the canvas for a new application, connect a data source and then click on the “Generate New Page” option. And here’s what this will do:
First, it will create four new queries for you from the selected data source that will do the following:
These straightforward CRUD operations will be automatically generated for users!
As for the UI, this feature will automatically create a new table and fill all the data in the table using the read query. However, users can customize the rows based on specific use-cases after the application is generated.
Next, when users click on the ‘Create Row’ button, it will open a modal to insert new rows into the table. This option will use the ‘Create’ query.
To update the data in a particular row, users can use the Update Row container on the right, where they will be able to update any row data by selecting from the table and using the form. This will be using the ‘Update’ query.
Finally, inside the table, the last column will be populated with buttons which when clicked will delete the entire selected row by using the ‘Delete’ query.
What a breeze! Not just that, the table comes with powerful features where users can search, filter or sort contents of the table by configuring it.
Following is the screenshot of the entire generated UI.
Now, we’ll talk about how to use this feature!
In order to be able to use this feature, the first step is to connect a new data source on the Appsmith application.
If you’re new to Appsmith follow the steps below:
You’ll see the following options:
Now, you can select the table and add a searchable column. As soon you click on the Generate Page, you’ll see the UI where all the CRUD operations can be performed.
Hola, and with just one click the entire application is generated. Hope you love this new feature.
We love feedback, and we want to know your thoughts. Write to us with your ideas, opinions, or even send us brickbats on firstname.lastname@example.org.
If you want to write a blog for us, send me an email and I’ll make it happen: email@example.com.
We’ve added yet another database integration to Appsmith; say hello to ArangoDB! ArangoDB is an open-source multi-model database system where you can natively store data for graph, document and search needs. And the best part? It’s free!
We’ve made it super easy to build new integrations on Appsmith. This is because we've architectured each integration as an individual module. It's super handy for us and contributors to build, customize and organize any new integration. This integration feature was developed by one of our users and top contributors on Github, Mingfang!
To learn more about Appsmith's backend architecture, we recommend you watch the session about integrations by our co-founders here.
Once the PR for the ArangoDB integration was raised, Sumit, one of our engineers from the backend team reviewed it. He then made all the changes and got things into a working shape. Needless to say that our QA team will ensure that these new features are bug-free in testing and production environments.
To start using the ArangoDB integration on Appsmith, you can sign in to your account or create one for free here and follow the steps below:
Note: Please whitelist Appsmith IP addresses to access ArangoDB Cloud projects.
With just three simple steps, you will be able to connect the ArangoDB Datasource to Appsmith. Now, follow the steps below to utilize the data and build UI.
Add the following query in the query pane and click the RUN button on the top-right.
This will return the values from the department table. Here’s a screenshot for your reference.
Similarly, you could run queries and connect with different widgets on Appsmith to build awesome dashboards and internal applications. If you do, don’t forget to tell us about it, we would love to feature your work! Your contributions and feedback help us make Appsmith better and we really appreciate it.
Don’t forget to sign up for our live events!
I announced the Appsmith project on Dev.to for the first time on Aug 21st. While stars don't reflect the quality of a project, seeing 1K stars on our GitHub project makes me happy. 😺
Check out the project at: https://github.com/appsmithorg/appsmith
A few reviews from developers:
In the past two months, we've seen thousands of users from 65 countries who've used Appsmith for building all sorts of internal apps and admin panels. We've also seen over 40 contributors who've reported issues and code.
We built Appsmith because there is no open-source platform that helps you build custom and beautiful internal tools or admin panels. Today Appsmith ships with 17 UI components, 7 database integrations, and a REST API connector. There's a lot more coming soon.
An Appsmith user said this: "This tool is perfect when you need an admin panel that needs to query multiple data sources in the same UI, update values from one with the other, and even use values retrieved from both to query external APIs."
Try Appsmith at appsmith.com
It's been a busy week at Appsmith, thanks to Hacktoberfest. There's no better way to end this week than by thanking all the developers who chose to contribute to Appsmith during this period. We are a small team of developers and this ❤️ means a lot to us.
Over the week, we've merged in 16 Pull Requests from contributors. That's insane!
"If you'd like to get in on the action, Appsmith is running a special challenge during the month of October where you not only get swag for contributing a valid PR but also a customized mechanical keyboard; for inviting other users to contribute to our repository."
"Check out details of the Appsmith Challenge here."
Here are the contributors (in no particular order) that I'd like to mention & thank.
Also, a lot of folks improved our documentation. We've merged 20 PRs just for our docs. Some of the top contributors to our documentation are:
Thank you everyone for being a part of this project. Look forward to more pull requests & contributions.
Hacktoberfest is a month-long celebration of open source software. As developers, we stand on the shoulders of giants. Each year, in the month of October, as a community, we pledge to feed this giant.
Contributing to open source projects is fun and rewarding. At times, it can even be daunting to get started. Lots of people believe that only code that implements large features matter. That's not the truth. No contribution is too small — bug fixes and documentation updates are valid ways of participating.
I'm doing a livestream on Appsmith's Discord channel today at 8:30 AM PST / 9 PM IST to help you get started and show you how to open your 1st PR. This 30 minute stream is a tutorial for new and seasoned developers.
The agenda for the livestream will be:
As the lead maintainer of Appsmith, I'll use our repository as an example of how to contribute.
Register for the event here. See you on the stream!
Shameless plug: Appsmith is an open source low code product to build custom internal tools and admin panels. We are a welcoming community & have lots of issues that first time contributors can pick up.