DEV Community: Bodhish Thomas

Automating Student Reviews with AI in Pupilfirst LMS

Bodhish Thomas — Fri, 13 Oct 2023 04:57:45 +0000

The integration of Artificial Intelligence (AI) into educational systems is a fascinating frontier. One area where AI can make a significant impact is in the review of student submissions. At Pupilfirst LMS, we've leveraged our existing Github Action integration to automate this process, making it more efficient and personalized.

Pupilfirst LMS already had a robust Github Action integration in place. This system pushes each student's submission into a new branch of a dedicated repository. From there, Github CI actions can be triggered automatically, and we have actions to grade and report the status back to the LMS. This existing setup provided the flexibility needed to build and test a new system without altering the core functionalities.

Grade Action: https://github.com/pupilfirst/grade-action
Report Action: https://github.com/pupilfirst/report-action

The main challenge was to convert student submissions, which are in JSON format, into a format that the AI model could easily understand. After several attempts, we realized that the best approach was to pass the JSON submission as-is, but with an additional explanatory prompt.

# The student's submissions will be an array of objects following the provided schema:
{
  "kind": "The type of answer - can be shortText, longText, link, files, or multiChoice",
  "title": "The question that was asked of the student",
  "result": "The student's response",
  "status": "Field for internal use; ignore this field during your review"
}

This allowed the OpenAI model to discern which fields to consider and which to ignore.

The AI Auto Review Action was born out of this need. The logic is straightforward: we inform the AI about the context of the submission and prompt it to generate a grade and feedback. The AI model returns the data in a JSON format that is compatible with our existing grade action.

It took just a day to write the code, test the action, and deploy it. The system is now used across various courses for automated submission review.

The integration of AI into our LMS has streamlined the review process, reducing the manual workload and enhancing the learning experience with personalised feedback.

It's a testament to how Generative AI addition can revolutionize traditional educational systems.

If you want to test the Action checkout https://github.com/pupilfirst/ai-review-action

ChatGPT: Revolutionizing Medical Data Extraction from Images

Bodhish Thomas — Thu, 05 Oct 2023 23:46:32 +0000

At Care, we've made strides in integrating medical devices into our system for seamless data capture. This integration considerably minimizes the manual data entry tasks for nurses.

Our team has developed middleware to translate HL7 data from these devices into a format suitable for Care's requirements. As a result, we have pioneered the creation of digital central nursing stations. These stations can be accessed remotely and are equipped to trigger alerts and dispatch event-based notifications.

However, our journey has been fraught with challenges. The majority of device vendors utilize proprietary data formats, often coupled with outdated data ports. What's more, the lack of documentation for these proprietary data schemas has made the development of open-source adapters a formidable task.

These challenges steered us towards exploring innovative solutions to capture data and further ease the nurses' workload. An idea we found promising involved utilizing the cameras integrated into our system. Given that these cameras have presets to capture clear views of patient monitors for remote assessments by doctors, we believed they might have another crucial application.

Our initial experimentation involved developing a simple service that could remotely adjust the cameras in each patient's room to the monitor preset. It would then take a snapshot and forward it for processing. Our team delved deep into testing multiple open-source image sets of 5-para monitors, combined with various OCR models, to extract the necessary data from these images.

Despite months of research and experimentation, our success was limited. But a breakthrough came unexpectedly when an intern in our team processed the OCR-generated JSON through ChatGPT. Remarkably, ChatGPT could easily identify and extract the required values from the OCR JSON.

Following this discovery, we further explored ChatGPT's capabilities with direct image processing. The results? Astonishingly accurate and efficient. It became evident that we had invested months trying to devise the perfect OCR model and image processing strategies when, in reality, an API call to ChatGPT would suffice.

Even in its experimental phase, Multimodal Generative AI models have showcased their potential to transform our data extraction methodologies. It offers a simplified approach to what were once intricate challenges, opening doors from accurately capturing hourly monitor readings to potentially turning lab report images into structured data. As we journey further into the domain of AI and eagerly await the advent of GPT-V, we remain excited about the forthcoming innovations that promise to elevate and redefine patient care.

Building Digital Public Goods: Journey with the Open Healthcare Network

Bodhish Thomas — Sun, 03 Sep 2023 18:49:53 +0000

I am Bodhi, a full-stack developer and digital nomad hailing from Kerala, India. From a young age, I was captivated by the magic of the web. I fondly remember tinkering with my school website and feeling a sense of instant gratification from building on the web. This curiosity led me to take up part-time projects developing web apps, even as I pursued a degree in Electronics and Communications Engineering in college. Although I dabbled in electronics and built a few contraptions, I soon realized that my true passion lay in product development.

My journey took a significant turn during college when I co-founded a student startup. Although we faced multiple failures, this experience was transformative. It instilled in me the confidence and drive to build and ship open products, and it taught me valuable lessons on refining and deploying ideas. Today, I am deeply involved in multiple open-source projects and open learning initiatives. I work full-time with Pupilfirst, developing an open learning management system, and I contribute to programs that teach coding to students across the country.

One project that holds a special place in my heart is the
The Open Healthcare Network (previously CoronaSafe.Network), which aims to improve the availability of healthcare resources across multiple states in India. I have had the privilege of maintaining this project and witnessing its positive impact firsthand.

The Open Healthcare Network

The journey of the Open Healthcare Network is a testament to the power of community collaboration and open-source development for public good. What began as a response to the COVID-19 pandemic has evolved into a comprehensive hospital management system operational across 11 Indian states, directly benefiting over 186.8 million people. The system, seamlessly integrated across 581 hospitals, has facilitated medical attention to 362,349 patients and enabled over half a million consultations via 1,884 dedicated health workers.

Leading the charge was a global team of 300+ open-source enthusiasts worldwide. I had the honor of directing this talented team and mentoring interns.

The efforts were recognized by the United Nations, which verified our product as a Digital Public Good (DPGA). This acknowledgment was not only a proud moment for our team but also a validation of our commitment to creating digital public goods that have a meaningful impact on society.

As we navigated the height of the pandemic, we focused on critical system scalability and charted a strategic roadmap for expansion into specialized remote critical care monitoring. Throughout this journey, we remained steadfast in promoting the ethos of open-source development tailored for the public good.

Open Healthcare Network has now expanded its feature sets and is being utilized by multiple states to run teleICU for critical care. This innovation connects medical colleges with district hospitals around the area, enabling experts in the medical colleges to see the patients in each bed via high-resolution cameras. Additionally, they can look at device readings digitally as it's all connected into the system using open-source tooling.

This development represents a significant advancement in remote healthcare services, facilitating real-time monitoring and consultation for patients in critical care, even from a distance. By leveraging the power of open-source tools and digital connectivity, we are able to bridge the gap between urban medical colleges and district hospitals, thereby ensuring that expertise is shared, and patients receive the best possible care, regardless of their location.

Reflecting on my journey, I have witnessed the transformative power of community firsthand. From the early days of tinkering with my school website, to working on large-scale projects like the Open Healthcare Network, the support and collaboration of the community have been instrumental in shaping my growth as a developer and in the success of the projects I have been a part of.

I encourage you all to actively engage in and contribute to the communities you are a part of. Whether it is by sharing your knowledge, mentoring others, or contributing to open-source projects, every effort counts. Together, we can make a meaningful difference in the lives of millions.

Github Repo

Mytemplate.xyz | A no-code personal website builder for developers

Bodhish Thomas — Sat, 21 Aug 2021 19:43:42 +0000

A No-Code developer website builder side project created with ReScript.

Why the builder?

Its super hard to find time updating a personal website. I wanted a simple flow with which I could take out that pain. The editor tries to make the personal website management simple with features like display blogs from Dev.to and projects from Github

Hosting with Github

Once you are done with editing click the download button. Commit the 'index.html' file that you downloaded to your github repository. Open Github setting and enable 'Github Pages'. Set source as your 'main' branch and folder as root. Commit the '_redirects' file to your repo. Your site will be live in few minutes. _redirects file, Watch Video

Hosting with Netlify

Once you are done with editing click the download button. Commit the index.html file that you downloaded to your github repository. Open Netlify and click 'New site from Git' button. Choose your repository from Github and click 'deploy site'. Add netlify.toml file to your repo if you have added a blog. netlify.toml

How to use import?

You can easly import the index file exported from mytemplate. Click the import button on the top right corner of this page. Enter your Github repositor in the required format and press the check icon on the import tab. This will import the file from Github, once the import is complete you can click the 'Open in Editor' button to complete import. Watch Video

Tech Stack?

The editor is created with ReasonReact(Rescript) and TailwindCSS.

Where to report Bugs?

Create a issue with details of the bug in mytemplate repo

Examples

Adding TailwindCSS to your Rails 6 Project

Bodhish Thomas — Sat, 12 Sep 2020 11:54:41 +0000

Tailwind + Rails 6

Steps to configure tailwindCSS in you rails 6 application

Install Tailwind CSS

Run the following command to add tailwind to the package.json

 yarn add tailwindcss

Create Tailwind Configuration

The following command will create a tailwind.config.js file where you could setup the default configuration for TailwindCSS

npx tailwindcss init

The taildwind config file will be empty and should look like

module.exports = {
  purge: [],
  theme: {
    extend: {},
  },
  variants: {},
  plugins: [],
}

Here is an example of my tailwind.config.js

module.exports = {
  theme: {
    extend: {
      colors: {
        primary: {
          100: "#fef6eb",
          200: "#f7c686",
          300: "#f4b35d",
          400: "#f2aa49",
          500: "#f1a035",
          600: "#d99030",
          700: "#c1802a",
          800: "#a97025",
          900: "#916020",
        },
      },
    },
  },
  purge: {
    content: ["./app/**/*.html.erb"],
  }
};

Adding tailwind to PostCSS config

You will need to add the following line to the postcss.config.js file.

require("tailwindcss"),

here is an example of my postcss.config.js file

module.exports = {
  plugins: [
    require('postcss-import'),
    require('postcss-flexbugs-fixes'),
    require("tailwindcss"),
    require('postcss-preset-env')({
      autoprefixer: {
        flexbox: 'no-2009'
      },
      stage: 3
    })
  ]
}

Import tailwind to your Javascript Pack

You will need to import tailwind via javascript.

create an application.css file in app/javascript/layouts/

I usually keep this in a folder called layouts, you could choose any other folder that's convenient for you inside the app/javascript directory

add the following to your application.css file that you have created now

/* tailwind */
@import "tailwindcss/base";

@import "tailwindcss/components";

@import "tailwindcss/utilities";

Import application.css in your app/javascript/packs/application.js file.
(add the following line)

import  "../layouts/application.css";

Import Tailwind to your layout

Now that you have added TailwindCSS to your application pack, you will have to import it in application.html.erb to use tailwind globally in your application.

Add the following line to app/views/layouts/application.html.erb in <head>

<%=  stylesheet_pack_tag  'application',  media: 'all',  'data-turbolinks-track': 'reload'  %>

Auto Deploy reason-react projects on Netlify

Bodhish Thomas — Sat, 09 May 2020 14:57:52 +0000

Auto deploy your Reason React project from Github to Netlify. When you push to Git, Netlify will auto deploy your project.

If you don’t have a project, you can get the basic setup instruction in reason react official documentation.

Steps:

1. Login/sign-up to https://netlify.com

2. Click on “New site from Git” button

3. Choose the Git provider where your site’s source code is hosted

4. Choose the repository you want to link to your site on Netlify.

5. Choose the branch to deploy and give the build commands and publish directory.

Build command

npm run clean && npm run build && npm run webpack:production

Publish directory

build

Fill-in the details and click “Deploy Site” button.

Your site will get deployed in 5 mins, All other commits you make to the branch you select will get auto deployed to Netlify :D

Reason React + Tailwind starter with Create Reason React APP (CRRA)

Bodhish Thomas — Wed, 04 Mar 2020 10:42:56 +0000

Quick Start

create-reason-react-tailwind is an easy way to get started with boilerplate reason react templates.

Install **crra**
```
npx create-reason-react-tailwind
```

2. Choose a template

You can choose the template from the template selector

3. Add a project name

after selecting the template, you will be asked to add a project name

add your project name and hit enter

4. Your create reason react app is ready 😃

cd my-app

You will get a pre-configured reason react template with parcel, postcss and tailwind. The bare minimum for creating a reason react project.

Github Repo

5. Install dependencies

npm install
npm run dev

You will be able to see the project running at localhost:1234

expected output

You may have to change the package-name if you plan to publish the repositoy (optional)

bodhish / create-reason-react-tailwind

Create Reason React App - A simple boilerplate generator for tailwind styled reason react project

Create Rescript / Reason React App

Rescript & Reason react boilerplate generator

Quick Start

npx create-reason-react-tailwind

What project template would you like to generate? (choose the template)

webpack-tailwind

Project Name - Add the project name

my-app

| crra will create a new folder with the template project.

cd my-app

Follow the instructions in README.md

CRRA

Add create reason react app globally

npm i -g create-reason-react-tailwind
crra

View on GitHub

Deploy your CRR

Auto Deploy reason-react projects on Netlify