DEV Community: Gaurav Gupta

Development Status - Smart Notes (BuildLog[4])

Gaurav Gupta — Sat, 20 Nov 2021 16:50:17 +0000

Hello, this is Gaurav Gupta👋 This blog post is regarding our development progress and changes in regards to our application, our progress speed-related information as well as about the plans we have for the future. So, let's jump right into it.

Development Status

As shared in the previous post, we have decided to use the Flutter framework based on Dart to build our application. We are still learning as well as implementing our learnings to build our application concurrently so please do guide us to improve any of our shortcomings in terms of development and design practices.

❗ Heads up: You will see alignment issues throughout the application at the moment, please pay no heed, as we will be fixing this one by one.🙏

We decided to first develop a rough hard-coded design of the application, which is unresponsive, for the foundations (Right now, the application is made solely developed for a 1920x1080 fullscreen resolution, and responsiveness will be added soon). We are trying to re-create the Figma design earlier created (you can see the designs here).

Dashboard

We have re-created the dashboard as closely as possible to the Figma design. As updated in our previous blog, we removed the 'Bookmarks' and 'Personal Notes' sections from the side navigation bar and moved them into the profile sub-menu. I added a small ribbon on the banner (This is temporary as I was testing new stuff out, if it looks good, we can keep it into the application, else remove it).

Explore

The explore page is mainly a scrollable list view of all the notes gathered in our database. The filter and sort buttons are dropdowns. I'll try to stylize them into a much better form (If you have any idea of how can I approach the styling of dropdowns that we had in our designs, please contact me through the links at the end of the post).

Classroom

Like you can see, there is no significant difference in terms of the design of the classroom section (except the extremely horrendous text alignment of course).

Sign In / Sign Up

We made a simple and function 'Sign In' and 'Sign Up' alert dialog. From the images earlier you can see that these can be accessed everywhere from the app bar. These are fully functional thanks to our sole backend developer @Shivansh Pandey. After signing up, the user can access the 'Personal Notes' and 'Bookmarks' sections (which I'm working on right now) through a small pop-up menu.

What is functioning?

You may be thinking that I'm always just sharing about the designs and the frontend portion of the application does anything even work or is it just for show?👀

Like I stated earlier, the sign-up and sign-in are fully functional allowing users to sign up and login into their accounts and access the 'Bookmarks' and 'Personal Notes' sections.
Addition of notes is also working allowing the explore page to update on the addition of new notes.
Shivansh has almost finished making the Dashboard 'Personal Notes' and 'Bookmarks' previews for dynamic updation according to the notes inside them.

What are you using as a backend?

We are using Firebase as the backend service for our application. Right now, Shivansh is also planning to start sharing a bit about how the backend of the application functions on his profile(You can visit his profile from here).
Being the sole backend developer as well as being new to flutter and Firebase, he has it tougher, and is pouring in hours to learn and implement things, so please support him if he starts blogging.

Hurdles

Right now, as flutter desktop is comparatively new, Firebase currently doesn't support it. So we are testing the application out as a web app, hopefully Firebase soon extends its support to the desktop.

Why is our progress so slow?

You may be thinking that the update posts and progress are pretty slow for the application. This is because of the massive workload we have received in academics. We are trying our best to balance the amount of work we put into this project and our studies, but due to a series of college projects, assignments and exams our progress has drastically slowed down and so is my consistency in posting blogs.

So how long will this continue?

Right now for about 4 weeks are left for the semester to end, till then I'll try to post our updates whenever I'm free for my studies, so please bear with us🙏. After that, since we'll be having our holidays, I'll try to post as many blogs as possible and make significant and rapid progress on the development.

We deeply apologize for the slow speed and poor consistency and work harder to get this application ready to use as early as possible.🙏

Future Plans

As for when will the development become open-source, we plan to work on this post our first phase launch (we would like to achieve that much on our own to gauge our skills in this new tech stack).
The note-gathering form/method would be up by the next month mid (probably right after the end of our exams or even earlier).
If you would like to see snippets of the code and would like to know more about the working then do comment and we can share it in our upcoming blogs.

Conclusion

That is all for this blog post regarding our progress. If you want to give us any suggestions, or guidance to improve our product then do feel free to comment or reach out to me via any platform links mentioned below.

Bye 👋

You can contact me through: HashNode, LinkedIn, and GitHub.

Progress and Note Gathering - Smart Notes Desktop App (BuildLog[3])

Gaurav Gupta — Mon, 01 Nov 2021 13:17:26 +0000

Hello everyone👋 This is Gaurav Gupta, and in this blog post, I'll be telling a bit about some decisions we have taken, the progress of our application and also would like to know your views on the notes you'd like to have. (I know this update has been pretty late, sorry about that😣)

Progress

Tech Stack

Like I wrote in one of my previous blog posts, we were planning to use ElectronJS to build our application as it allowed us to re-use our existing HTML, CSS, and JS skills, but we finalized on using Flutter (which uses Dart programming language)to build our app instead of ElectronJS. For the backend, we'll be using Firebase.

We'll still be researching the technologies we will use for the backend - so I'll keep you updated about it.

Why Flutter?

We decided to go flutter as it is easier to make our application cross-platform supporting Windows, macOS, Android, and iOS through a single code-base. It is comparatively much lighter than ElectronJS (just the starter project of Electron uses more than 300 MB🤯 compared to the 50MB size for a Flutter application).

Even though Flutter Desktop and Flutter Web are new compared to ElectronJS (Flutter Web just came into the stable channel while Flutter Desktop is in the Beta phase) we considered it a worthy investment for any future projects and also open more opportunities for us at a career point of view. On consulting our college professors and also through Reddit, people suggested we go for Flutter and that's how we decided to go with Flutter rather than ElectronJS.

What about the actual "Progress"?🤔

Right now, we are simultaneously learning flutter and implementing our learning in our application towards the development of the User Interface of the application. Since right now, we are just in the phase of building the bare bones of it, I'll be sharing the visuals of the progress at a later date - possibly the next blog post (I swear the next post won't be too late).

❗Heads Up: As far as the visuals of the applications are, we plan to make a few trivial changes to further utilize the spacing in it and likely a minor update to the UI to incorporate better functionality to our Dashboard.

Note Gathering

We plan to start sorting out notes and start the process of gathering them soon, so we would like to know your opinions on the type of notes you'd like to see on the application. The responses would shape the future of the application's content, so do give us a few minutes of your valuable time to contribute to it.

You can go through this explanation (2 min read) and answer the poll given in that question or do comment and tell us what you would like to see notes about.

Please answer the poll or comment your opinions, as it directs us to the path we have to take moving forward.

As for those who would like to contribute to the development of the application, note-making, or note-gathering, stay tuned to the blog as I'll soon be sharing the details regarding them.

I know this is a small update and that too pretty late but I'll make sure to keep posting the updates on a regular basis.

Thank You😊

Let's connect: HashNode, LinkedIn.

Smart Notes BuildLog[2.5] - The notes

Gaurav Gupta — Wed, 27 Oct 2021 18:07:56 +0000

❗ Note: Regarding more information about the poll, scroll to the last section of this blog, and to know more about what our product, Smart Notes is, you can visit here.

Hey👋 I'm Gaurav Gupta. In this short blog post, I'd like to know your opinions regarding the type of notes you'd want and would be beneficial to the majority. So, let's jump right in.

What notes should our application consist of?

For our desktop application - Smart Notes, we would like to know your opinion regarding which level of notes we should start. Some of the few options we came up with are:

Pre-University College (11th and 12th class) Subjects: These would consist of notes of Physics, Chemistry, and other theoretical subjects in PUC classes.
Engineering Theory Subjects: These notes will consist of Engineering Physics, Engineering Chemistry, or higher level subjects like Finite Automata and Finite Language, or Discrete Mathematics.
Coding Related Subjects: These notes would cover topics like Basics of C programming, or Python, Java, and others or covering Data Structure and Algorithms.
Non - Engineering Subjects: These would consist of non-engineering field notes like Commerce, or Biology, and others. If you'd like notes of any other subjects do tell us, and we'll try to gather the best possible notes of them after reviewing them from professionals of the respective fields.

Do comment on any subject or topic you'd like us to cover the notes for, be it engineering, PUC, or non-engineering streams.

PS: It would be appreciated if you can go to this same blog post on HashNode and answer the poll for this same question (poll available here).

Let's connect: HashNode and LinkedIn.

Completing the UX design of Smart Notes. - BuildLog[2]

Gaurav Gupta — Sat, 16 Oct 2021 17:14:14 +0000

Hello everyone👋 I'm Gaurav Gupta. In this blog post, I'll be sharing the latest high-fidelity model of our desktop application (if you want to haven't checked out what our product is about, you can check this).
Since the previous blog post, from the valuable insights offered by others and our colleagues, we made a few changes in the UI of the application and finished a high-fidelity prototype of the application.

Color Palette

We have used the above color palette to stylize our application consisting of different shades of blue.

Dashboard

If you compare the above image with the low-fidelity design of our application, you'll notice that we have removed the 'Bookmarks' and 'Personal Notes' sections from the sidebar. We decided to move those tabs under the 'Profile' section on the top right. They will be available as a sub-section under it rather than as separate sections in the Navbar. This allows us to reduce the clutter on the navigation panel on the left and show the most important sections of our application to the users.

The top banner in the dashboard shows newly added or the trending notes/lecture among the user base in one of the user's subjects of interest. We also decided to remove the classrooms previews to minimize the content available on the dashboard.

Explore

Each 'Note Card' shows the thumbnail of the video provided, the video/notes title, the number of likes given by the users on the note, and the comments given by the users. We plan to add the bookmark button, and the ' Add to Cart ' button when the Note Card is opened (the design for this section will be shared at a later date).

Classrooms

Each classroom will have a banner that the admin of the classroom can choose, the profile picture of the admin of that classroom, the name of the classroom, and the admin name.

We decided to move the tags of each classroom inside the classroom settings which would be available to the admin of the respective classroom.

Classroom Info - Stream

According to the inputs provided by my colleagues, we decided to change the 'Stream' tab of the classroom. We concluded on a discord-style stream which made the classroom more of a discussion forum but decided on the removal of channels feature which made the screen too cluttered.

Classroom Info - Notes

We kept the google classroom-style 'Notes' tab where all the notes from the entire classroom would be available.

Bookmarks

Like in the previous iteration, we are using the same bookmarks page. It offers a 'Recent' section for the learner to jump right in the notes they were studying earlier. The 'Bookmarks' section contains all the bookmarked notes which are provided by us. Bookmarks tab consists of a separate 'Classroom Bookmarks' section, which solely consists of the bookmarks of the user from classrooms (since these are not made by us but fellow learners, this helps the user to avoid confusion between which notes are provided by us and which are provided by other learners).

Personal Notes

The 'Personal Notes' section consists of notes made by the user for their use. These notes can be shared with others in classrooms. We decided to make it 'Google Keep' style like mentioned earlier allowing different lengths of note previews depending on their content size.

Conclusion

The design is made by complete beginners so all suggestions regarding any changes to be made are greatly appreciated. So, do give us your inputs on how you feel about the design as it encourages us to keep moving forward with the project and keep improving.

❗ Note: All the sub-menus like the settings page, and Notes Info page, and sub-menu designs will be shared at a later date as we are still working on their designs.

Connect with me on: HashNode and LinkedIn

Smart Notes - A Build-in Public Product. BuildLog[1]

Gaurav Gupta — Fri, 08 Oct 2021 18:18:38 +0000

Hello everyone👋 This is Gaurav Gupta.
In this post, I'll be sharing a few low-fidelity screen designs of the application as well as some of the ideas regarding the design (If you don't know about the product, you can read this). Since the rough sketches shared in the previous post were made in a random screen resolution, we decided to test them on 1920 x 1080 frames on Figma.

❗ Note: All the colors used in the below designs are used to signify buttons or active fields and are not related to the color scheme of the application.

Dashboard

We recreated the rough sketch we shared in the previous post onto the frame resulting in the above-shown look. (I feel that there could be some changes to the dashboard, do let us know what improvements can be made). A comparison between the sketch we shared before and the recreation of it on 1920 x 1080 resolution frame:

Explore

A quick comparison:

Bookmarks

The 'Recent' section would allow the horizontal scroll to go through the recently opened notes. The 'Continue' button would allow the users to jump to the sub-section where they left off.

Comparison:

Personal Notes

We plan to make the size of each notes card differ depending on the amount of content present inside the card (such as that in Google Keeps or Pinterest).

Comparison:

Classrooms

Comparison of Classrooms dashboard:

Classrooms Information

We require your suggestions regarding the interface for the Classroom Information page. We are confused between 2 different looks for the page.

Interface 1 - Google Classroom Style

The Stream tab shows all the announcements (may or may not contain notes) any learner sends in the classroom on which others can comment and give feedback to them. This allows the entire population base of the classroom to interact with each other in just one place.

The Notes tab shows all the notes sent by any learner who is a part of that classroom.

Interface 2 - Discord Style

In this version, we decided to collapse the main navigation bar to just the symbols and allow for different channels inside the classroom (according to the classroom admin decisions). This follows a discord-based layout allowing separation of concerns within the classrooms (channels can be like, doubts, note-sharing, etc). The notes icon in the top right signifies the 'Notes' tabs. It would contain all the notes shared within the classroom.

Which classroom style do you prefer? Do tell us in the comments which 'Classroom' style you prefer (as I don't know how to create a poll on HashNode😭).

Please do share your opinions on the design of the application to improve it. We would love to know about any features you would like to see in the product.😊

Ideas Proposed

Some of the ideas that we came up with during our discussions are:

The 'Bookmarks' and 'Personal Notes' sections can be shifted from the side navigation bar to a sub-menu under 'Username' (Top-right) thus, reducing the space consumed in the navigation bar. - @Shivansh Pandey
We can provide a few sets of theme colors to the user (apart from 1 default theme) from which the user can choose to customize the web application to their taste (like the one introduced on the Twitter website). - @Anand Singh Tanwar

Future Steps

Our first immediate goal is to finish a high-fidelity prototype of the application.
Right now, we have planned to use Electron (with ReactJS) to build the product.

If there is a better alternative to build the application, do let us know as anyways we'll have to learn Electron as we have no experience with it - any resource links are greatly appreciated.

Conclusion

This sums up the progress we have made regarding the application. Your suggestions are required to shape the product to provide the best possible notes for students. So do leave your suggestions, improvements, or features you wish to see in the application.

Let's connect: HashNode, LinkedIn.

Smart Notes Desktop App - A Build In Public Product

Gaurav Gupta — Sat, 02 Oct 2021 16:20:41 +0000

Hello everyone👋 I am Gaurav Gupta, an undergraduate student majoring in Computer Science and Technology. My friends(Shivansh Pandey and Anand Singh Tanwar) and I decided to build a product in public to get feedback from fellow developers and potential users (yeah YOU!).

(If you are wondering why we decided to build it in public, Article 1, Article 2 are a few of the articles which inspired us. At least through this, we can be consistent while building our product).

What is the Product we're building?

We are building a "Smart Notes" desktop application (yet to be named) for learners across the globe. Rather than just being a note-taking app, it can do a lot more to increase a learner's productivity. We aim to eliminate the time it takes for the learners to watch an hour-long video and provide them with thoroughly explained notes of the same, which they can access and study at their convenience in a lesser amount of time.

❗ Disclaimer:
None of us are experts at any of the technologies we plan to use to build it. We are barely beginners at them and will be learning during our journey.

Features we plan to Offer

Some of the features that we have planned to offer to the learners are:

Notes Database: We plan to have a database of all the notes that we will be preparing so that learners can check if a topic they require already has notes prepared, and they can jump right in.
Bookmarks: By allowing the learners to bookmark notes, they can go through those notes at any time to revise topics and solidify their concepts.
*Personal Notes: * The learners may still prefer to make some notes of their own while going through the topics, or even our notes, so we decided to add a 'Personal Notes' section to make their notes.
Request Notes: Since there will surely be scenarios where we may not have notes of certain topics, we intend to add a 'Request Notes' function so that the learner can provide us with the video lecture and we can get back to them with the detailed notes of the same.
Classrooms: Classrooms are discussion forums for various subjects, where the learners can interact with each other and help each other out, and share resources.

Rough Design of the Application

We came up with a few initial rough designs for different pages of the application. These designs are made as UI/UX design rookies, and any kind of feedback is highly appreciated for improvements.

Dashboard

On the dashboard, we plan to show any classrooms that the learner has joined, a preview of the first few personal notes, bookmarks the user has stored, and any requests they would have made to us and their statuses.
We also plan to show some random snippets of information to the learner that may help them learn a small fact according to their interest. Sometimes we plan to show any upcoming events from the different platforms that may interest them OR any event hosted within our community.

Explore

The Explore section consists of the notes we would have made on a certain topic, either on our own or on request. Some notes would be free for every learner to read, while some of them, like that of huge topics (OR the notes of paid content - made with the permission of the actual content creator), would be charged.

Bookmarks

The Bookmarks section consists of the notes the learner bookmarks to get back to for reference and revision. The 'Recent' sub-section consists of the notes that the learner has opened earlier. We decided to separate the 'Classroom Bookmarks' from the rest so the learners can differentiate between the ones shared by other learners and the ones shared by us.

Personal Notes

The 'Personal Notes' section can be used by the learners to store their notes. We decided to make each note as a card (like in Google Keeps) which consists of basic text editing features. On successful implementation, we plan to upgrade them similar to Excalidraw which gives the user a higher degree of freedom for note-taking.

Classrooms

'Classrooms' are various discussion forums (like discord servers) that are under different hashtags (based on subjects or streams) where learners can discuss any topics, share knowledge, notes, and also share each other's doubts. This encourages everyone to be helpful to others, as teaching is the best way to learn and revise something.

Your Opinions Matter!

We need your opinions to make a successful product to help the community get access to great quality notes and minimize the time one spends going through long videos to understand a topic. We are just a team of 3 who in no way are experts at what we are building and these rough outlines of the application are merely made from what we think may look good, so comments regarding improvements are appreciated👏

Please do comment and give us your feedback regarding any features that can be improved in the application, or any features which can be removed or changed for a better user experience. Also, do comment on any feature you think would be helpful for the learners that can be added.

PS: You can check the updates on HashNode too.

Java - Storing Data (Part 2: Data Types)

Gaurav Gupta — Sun, 12 Sep 2021 10:59:52 +0000

Hey, there👋 Welcome back to Part 2 of Java Learnings Vault (If you haven't checked out Part 1, you can go right here). In this blog post, I'll be telling a bit about the various data types of Java.

Before starting with what are data types, we will first need what are variables.

What are Variables?

As we know, data is an important part of a program, basically the main ingredients of a program, and we need to store this data somewhere, right? We use variables to store this data.

The image above is an example of an integer variable (we'll discuss this in a moment) of the name "number" which stores the value 20.

What are Data Types?

As data need not always be an integer ie., a number, there are different types of data like a string (ex: HashNode), a decimal number (ex: 3.14), or simply a character (ex: z). For java to know what type is the data we are providing, we use "Data Types". So the above example can be simply given in the format:

A formal definition of data types is:

Data types specify the different sizes and values that can be stored in the variable.

Data types are broadly categorized into 2 categories:

Primitive Data Types: The primitive data types include int, char, boolean, float, double, long, etc.
Non - Primitive Data Types: The non-primitive data types include String, Arrays, etc.

In this blog post, we'll be discussing just the primitive data types.

Primitive Data Types

The primitive data types are the most basic in Java. Now, talking about different primitive data types.

Boolean: This data type is used to store only 2 possible values: true and false. This data type is usually used as flags to track simple true/false conditions. The Boolean data type specifies 1 bit of information.

Integer: This data type is used to store 32-bit signed whole numbers (signed numbers include both negative and positive values) between the range -2^31 to 2^31 - 1. The Integer data type takes 4 bytes of space.

Byte: The byte data type can store whole numbers from -128 to 127. This data type takes 1 byte of space (just like its name).

Short: The short data type can be used to store whole numbers from -32768 to 32767. This data type takes 2 bytes of space.

Long: The Long data type is used when we need to store values more than the range int can support. This data type takes 8 bytes of memory space.

You may have noticed in the image that the value is followed by an uppercase 'L'. This is done to explicitly state that the number is of long data type and not an int.
The ending need not be an uppercase 'L' but can even be a lowercase 'a, but it can often be mistaken as '1' (one) so uppercase is usually preferred.

Float: The float data type is used to store decimal numbers. Its value range is unlimited. The float data type takes 4 bytes of space. (source)

Note that we follow the value with an 'f' or 'F' to explicitly state it as a floating-point number.

Double: The double data type is also used to store decimal numbers. It also has an unlimited value range. (source) But it shouldn't be used to store precise values like currency. The double data type takes up 8 bytes of space.

Character: The char data type is used to store a single character. We surround the value of this data type with single quotes (' ').

Why so many data types to store whole numbers and decimals?🤔

After seeing these data types, you may be wondering why do we even need so many data types just to store a whole number? Why not just use long to store all whole numbers?
The reason is simple, if you look again I have mentioned that each data type takes a different amount of memory space. So, using the long data type to store all whole numbers results in the use of a larger amount of memory. To fully utilize memory we use different data types. The same reason applies to the use of float and double.

In simple terms, why would you want to use a box, the size of a fridge, just to store a small candy? So, we use appropriate-sized containers to store the items to efficiently manage space.

Summary

To sum up data types and their classification you can have a look at the below diagram.

To see the amount of memory size each data type takes, you can have a look at the table below.

This marks the end of this blog post. Any feedback and suggestions are greatly appreciated. If my posts are helping you, do comment and show some love by sharing them with your friends.💖

PS: You can also find me on HashNode

Bye, until next time👋

Java - The Beginning (Part 1: The Theory)

Gaurav Gupta — Thu, 09 Sep 2021 09:56:00 +0000

Hello everyone👋 I am Gaurav Gupta, an undergraduate student pursuing Computer Science from India. Before we dive into the blog, first I'd like to tell you about why this blog exists and what will be Learnings Vault.

Why this blog exists

Ever since I started programming I always felt that I was lacking somewhere, and I keep discovering holes in my knowledge in many topics, sometimes the fundamentals aren't strong or other times it's some advanced topics.

I write to discover what I know. - Flannery O'Connor

I wanted to write down my programming journey and learnings to identify what I know and where I can improve. This idea ended up here as a blog rather than a physical journal of my learnings because either I lose them or just never go back and revise them at regular intervals. Due to my personality, I constantly check on my posts or any activities that I have made public where people may see and judge me. This will at least force me to continuously go through my learnings, helping me to revise stuff. This has given birth to Learnings Vault.

❗❗Note: By no means, I am an expert at the topics I'll be writing in this blog, you can consider this as a beginner's point of view and understanding.

What will be Learnings Vault?

Learnings Vault will be more of an online journal of my programming studies. If my vault may help some people then I can hopefully consider it as my contribution to the community😁.
I recently started learning Java and even after going through the concepts I have written in my physical notebook, I found shortcomings in my knowledge while I was attending college lectures of the same. So, this blog post will be about whatever I learn during my journey in Java where I can learn from others' critics and suggestions.

Suggestions and resources to improve me are greatly appreciated.💖 So, without any further blabbering, let's begin.

What is Java?

Java is a general-purpose, class-based, object-oriented programming language designed for having lesser implementation dependencies. It is fast, secure, and reliable.

How Java execution differs from other Object-Oriented Languages

In an Object-oriented language like C++, the high-level code, which is human readable, is compiled directly to a Machine Level code (0's and 1's). This machine code is platform-dependent (ie., depends on the OS it is compiled on). For example, if a C++ file is compiled on a Windows machine, then the compiled machine code (.exe file) will not run on a Mac machine and vice versa.

To overcome this issue, Java produces Byte code (.class file) on the compilation, which is platform-independent which can be shared among machines having different Operating Systems. But this byte code cannot be directly run on a system and requires a Java Virtual Machine (JVM) to be executed. This JVM is platform-dependent ie., each OS has platform-specific versions of JVM that are used to execute this byte code.

The Java Structure

WOW! That looks layered and complex😱 Trust me, IT IS🙂

So, let's begin with the outermost layer.

Java Development Kit (JDK)

The JDK provides an environment to develop and execute (run) Java programs. It is a package which includes:

Development Tools - Environment to develop programs
Java Runtime Environment (JRE) - To execute the programs
A compiler (javac)
Archiver (jar)
Documentation Generator (javadoc)
Interpreter/Loader

Java Runtime Environment (JRE)

The JRE (also written as Java RTE) is an installation package that provides the minimum requirements to ONLY execute a Java program onto your machine. It consists of:

Deployment technologies
User Interface Toolkits
Integration Libraries
Base Libraries
Java Virtual Machine (JVM) - JRE provides all the libraries & files the JVM needs

Java Virtual Machine (JVM)

JVM is an abstract machine/specification that provides the runtime environment in which the java bytecode can be executed. The JVM performs the following operations:

Loads code
Verifies code
Executes code
Provides runtime environment

JVM Architecture

On compilation by the java compiler (javac), the Java source file (.java file) gives a Byte code file (.class file) which is then given as an input to the JVM, specifically the Class Loader Subsystem.

The Class Loader Subsystem mainly has 3 functions:

Loading: It reads the .class file and generates binary data. An object of this class is created in heap. This further contains 3 modules - Bootstrap Class Loader, Extension Class Loader, and Application Class Loader.
Linking: The main functions of Linking include verification, preparing, and resolving. Here, the JVM verifies the .class file, allocates memory for class variables, and the default values, and replaces symbolic references from the type with direct references.
Initialization: All the static variables are assigned with their values defined in the code and the static block. In JVM execution, the interpreter executes the code line by line. But one, limitation is that when a method is called many times, it will interpret it again and again.

The execution inside the Class loader subsystem is Loading -> Linking -> Initialization.

The JVM also contains stack and heap memory allocations but I won't be going into too many details to avoid information overload and confusion (neither do I understand the details😣). It is fine if you don't understand the above architecture completely, neither do I. The basic gist of it should be enough for the beginning, we'll get back to the details later.

An easier way to understand the relation between the JVM and JRE is:
The JRE is a box and JVM is the content inside the box which does the main work.

Just-In-Time (JIT)

It is also called the garbage collector and its main purpose is to solve the limitation of JVM execution. The methods that are repeatedly called, JIT provide direct machine code so the re-interpretation is not required which results in faster execution.

Summary of the JVM Working Architecture

To summarize the working architecture of Java in a simpler diagram for better understanding you can look at the below diagram.

I guess this should be enough theory for beginners like me, even if isn't completely understood it's fine. We'll continue next time starting with the coding part (hopefully👀).
Any suggestions or resources to increase my understanding and which would be helpful to others are greatly appreciated.💖

PS: You can also find me on HashNode

Until next time. Bye👋