Let's Grow Together - Developers Interaction Portal - Jetir.Org
←
→
Page content transcription
If your browser does not render page correctly, please read the page content below
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162)
Let’s Grow Together – Developers Interaction
Portal
1
Amaan Ansari, 2Anas Ahmad, 3Mr. Umesh Pratap Singh
1
Undergraduate, 2Undergraduate, 3Assistant Professor
1,2,3
CSE Department,
1,2,3
SRMCEM, Lucknow, India
1
amaanansari09.abc@gmail.com, 2anas098ahmad@gmail.com , 3Usgemini@gmail.com
Abstract: This research paper talks about a website specially made for developers. It has all the features in social media site like
sharing, posting, and interacting with other people. What makes our website different from other is it is specifically targeted to
developers. There are only a few other alternative where developers can interact with other fellow developers and work on same
code base at real time.
Keywords – React.js, Node.js, Express.js, MongoDB, online compiler, developers’ portal.
I. INTRODUCTION
Nowadays, there are multiple platforms where different kinds of developers can ask some help for their problems in code, also
there are multiple websites where developers showcase their project works/glimpse of their articles, but all of these are scattered
here and there on internet. Different kinds of social media platforms are available for people, but if a person is searching or trying
to get knowledge about certain thing related to his field, he/she can be easily distracted as there are many unnecessary contents
available on them. The main problem is the lack of platform, especially for developers where various services should be available
such as asking about error in their codes, sharing some snippets, viewing other’s project work, creating new connections, sharing
experience socially and much more everything at one place. In this project, we will look forward to create such a website where
all the above-mentioned facilities can be easily available and accessible.
II. OBJECTIVES
Main objectives of our project are:
To provide a platform for developers to connect with other people across the globe.
To build an interactive and collaborative environment for developers helping them to gain more knowledge of theirs as
well as other domains.
To helps developers to build their network which will be helpful for their career.
To allow users to view other’s GitHub profile and their projects.
To provide Create, Read, Update and Delete (CRUD) functionality to users for their posts and projects.
To provide a forum posts section, where any user can ask their queries or show their achievements, to which others can
also respond by liking and commenting on them maintaining the social relationship among users.
To provide the ease of online compiler directly on the website where the user can directly run their code or test the
solutions provided by others.
III. LITERATURE REVIEW
Connecting and building relations with people is one of the most different and amazing feeling in world. But when it comes to
building relations with people through whom you can seek inspiration and learn new things, this has never been easy. But with a
proper platform where only specific domain-oriented people can join and showcase their work experiences, many newcomers can
learn a lot without any distracting content like any other social media platform. Allowing users to access GitHub for their
knowledge seeking through different user’s work articles will lead them to explore more. Also, different users can collab with each
other and can work as a team for a specific project.
The problem we are trying to solve is the lack of a platform for developers where they can get all the services like asking about
code error, sharing code snippets, working on a code editor online with different developers in real-time, creating new connections,
and sharing their experience on a social platform, everything at one place. Let’s Grow Together provides all the features such as
social media platform, code editor and compiler, social forum and posts on a single platform. When a user registers to this website,
JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e419
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162)
they experience a clean UI, developers’ section, forum posts and a dashboard to get started on our website. People can use it as a
platform to increase connections or can also use it to work on the same code base in real-time with multiple developers.
We describe social network sites as web-based services that allow users to create a public or semi-public profile within a
constrained system, articulate a list of other users with whom they share a connection, and browse and navigate their list of
connections as well as those produced by others. The type and terminology of these links may differ from one site to the next. As of
this writing, there are hundreds of SNSs serving a wide range of interests and practises, each with its own technological
affordances. Most services help people maintain current social networks, but others connect strangers based on shared hobbies,
political views, or activities. Some sites cater to a wide range of people, while others draw people together based on shared ethnic,
sexual, religious, or nationality identities. Sites also differ in how much new information and communication capabilities, such as
mobile connectivity, blogging, and photo/video sharing, are incorporated.
IV. PROPOSED METHODOLOGY
MODULE DESCRIPTION
This section includes the modules, architecture and various elements that are combined to form the whole system’s framework.
The proposed framework consists of the whole process of a user from creating his account to making connections with other
people.
Fig 4.1- Block Diagram of the website
4.1 LOGIN/REGISTRATION MODULE:
The primary advantage of Token-based Authentication over Session-based Authentication is that we store the JSON Web Token
(JWT) on the client side: Local Storage for Browsers, Keychain for IOS, and Shared Preferences for Android... As a result, we
won't need to create a separate backend project for Native Apps or a separate Authentication module for Native App users.
Fig 4.2 Different types of user categorization
How JSON Web Token (JWT) authentication works?
JSON Web Token (JWT) is an open standard (RFC 7519) for securely exchanging information as a JSON object between parties.
It is small, readable, and digitally signed by the Identity Provider using a private key/or a public key pair (IdP). As a result, other
parties can verify the token's integrity and legitimacy.
The goal of utilizing JWT is to confirm the data's authenticity, not to hide it. JWT is signed and encoded but not encrypted.
JWT is a token-based stateless authentication method. The server doesn't have to depend on a datastore (database) to save session
data as it is a client-side stateless session.
Structure of JWT
A period separates the three sections of a JSON Web Token - header.payload.signature. It would be a full stack MERN
Authentication system, utilizing Node.js Express on the back end and React.js on the front end. JWT Authentication is then used to
validate access.
JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e420
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162)
4.2 USER’S DASHBOARD
This module will provide users the UI to fill their details for profile setup. These will include Professional status of a person
whether he/she is employed or not or looking for a job. If employed, then the details of company where he/she is employed and the
website of that company.
User can add his personal information also with restricted access to others such as their location, date of birth and marital status etc.
User can add his/her skills which will be further added to their profile and will be visible to others creating a good impact.
For their projects and other uploaded open-source stuff, user can mention their GitHub username through which others can view
their work experiences.
Fig 1. Dashboard Module
4.3 HOMEPAGE
This module consists of three sub modules which are:
Developers Section
This section leads us to a page where list of all the developers who have registered on this website are shown, with the
glimpse of their profile, thereby giving option to connect directly with them and list of their repositories of their GitHub.
Fig 2. Developers Module
Posts Section
This section shows the interface for a user’s post and what other developers have responded to it giving options for like,
comment and share.
JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e421
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162)
Fig 3. Posts Module
Profile Section
The profile section includes all the details of a user including his personal as well as his professional details.
Fig 4. Profile Module
Online Compiler
The Online Compiler module gives the user facility to run their code on the go without visiting any other external site
and breaking the flow.
Fig 5. Compiler Module
V. TECHNOLOGIES USED
Let's Grow Together is an application which build on famous MERN (MongoDB, Express.js, React.js, Node.js) stack.
MongoDB - document database
Express.js - Node.js web framework
React.js - a client-side JavaScript framework
Node.js - the most popular JavaScript web server
JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e422
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162)
The middle (application) tier comprises of Express and Node. The Node.js server platform is a popular and capable JavaScript
server. Express.js is a server-side web framework. MERN is the best way to work with JavaScript and JSON from start to finish.
The MERN design makes it simple to build a three-tier architecture (frontend, backend, and database) using only JavaScript and
JSON.
4.1 MongoDB
MongoDB is a NoSQL database, so rather than storing data in a relational style, it saves it in documents. MongoDB is as a result
incredibly adaptable to real-world business conditions and requirements. It's a document-oriented NoSQL database that can hold a
lot of information. It uses collections and documents instead of tables and rows, as in traditional relational databases. MongoDB's
basic data unit is key-value pairs, which make up documents. In the same way that relational database tables include sets of
documents and functions, collections do as well. MongoDB is a sophisticated no-SQL database that also has SQL capabilities.
This means that we can simply create extensive APIs that can store data as documents in JSON format in multiple collections
(Tables in SQL), and since it's a JSON file, we can do so without knowing difficult SQL queries
4.2 Express.js
Express is a Node.js back-end web application framework released under the MIT License as free and open-source software. It is
designed to be used in the creation of web applications and APIs. It has been dubbed the "de facto" Node.js server framework. It
helps to write our back-end code and implement it in a very structured format. As Express supports many middleware which
makes the code shorter and easier to write, it helps in designing the web applications and API’s which are required in the project
all along. Some of the biggest advantages of Express are asynchronous programming and single threaded architecture.
4.3 React.js
React is a user interface library that was first developed as a Facebook internal library before being open-sourced in 2013. It's well-
known and widely utilized for a variety of purposes. It creates user interfaces for single-page web apps by breaking the user
interface down into modular pieces. The learning curve is rather short because it only takes a basic familiarity of JavaScript and
HTML. We'll even use the "vanilla DOM JavaScript API" in some circumstances (you'll see what I mean later), which means the
programmer won't have to learn anything new to get started. If you've ever built a simple website in HTML, you've probably
wished to gather a lot of HTML elements and then save them as a 'variable' so that you may reuse them later. This is a lifeline for a
developer. Such a feature is possible to implement with React. COMPONENTS are the foundation of the React framework. We
can construct these components once and then utilise them in multiple applications. Code redundancy is reduced by a huge factor.
4.4 Node.js
Node.js is designed using single-thread architecture. It employs event-driven, asynchronous programming callback functions,
which means that while they appear to be registered sequentially in the logic, they are not dependent on the code in which they
appear, instead waiting for the associated event to happen. The call back function code is executed without waiting for a specific
code to complete, allowing the limited resources to be utilized for other tasks such as our web application's business logic.
Node.js makes extensive use of network modules such as HTTP, DNS, NET, UDP, HTTPS, TLS, and others. Developers can
utilize these network modules to create a Web server.
VI. FUTURE WORK
Currently, this website has almost all the features of social media but for better and interesting interaction, private and group
chat facility can be added. The UI of the website can also be made attractive using GSAP animations or Anime.js. Chatbot
functionality can be provided to users where the FAQ’s can be answered without any waiting. The future scope of our project
would be making it open source and asking other developers for their contribution and new ideas a few of them will be a section for
tech news updates and a section for learning chatbots to answer your tech questions.
VII. CONCLUSION
The application will be small social network app that includes authentication, profiles, forum posts and online compiler, this
application also includes a GitHub API which allow other developer to view a developer’s GitHub profile and his recent projects.
This application uses an authentication features and private routes, which allows only authenticated users to like and comment on
JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e423
© 2022 JETIR May 2022, Volume 9, Issue 5 www.jetir.org (ISSN-2349-5162) developer’s recent post, this application allows developer to create, delete and update (CRUD) their posts, Developer can like and comment on other’s posts like any other social media platform and for the ease of asking doubts and queries, online compiler is provided. We were able to deploy our website and everything works fine. Posts are being posted, code compiler and editor are working properly, developers are using the social forum feature for asking doubts, etc. We will keep improving our features. REFERENCES [1] Liang, L., Zhu, L., Shang, W., Feng, D., Xiao, Z. (2020). Express supervision system based on NodeJS and MongoDB. [2] Rafal Golawski, Emily Morehouse, Matt Zabriskie, Nick Uraltsev. Node Package Manager: Packages. [Online]. Available from: https://www.npmjs.com/ [3] Ali Alhaddad. MERN Stack. [Online]. Available from: https://medium.com/@alialhaddad/ [4] M. R. Solanki, A. Dongaonkar, A Journey of human comfort: web1.0 to web 4.0, International Journal of Research and Scientific Innovation (IJRSI), Volume III, Issue IX, pp. 75-78, 2018 [5] Javeed, A. (2018). Performance Optimization Techniques for ReactJS. 2019 [6] Sterling, A. (2017). NodeJS and Angular Tools for JSON-LD. 2019 IEEE 13th [7] Laksono, D. (2017). Testing Spatial Data Deliverance in SQL and NoSQL Database Using NodeJS Full stack Web App. 2018 [8] Patil, M. M., Hanni, A., Tejeshwar, C. H., Patil, P. (2017). A qualitative analysis of the performance of MongoDB vs MySQL database based on insertion and retrieval operations using a web/android application to explore load balancing Sharding in MongoDB and its advantages [9] JavaScript specification. Retrieved from http://www.w3.org/standards/ webdesign/script, November 1, 2016. [10] “Refs and the DOM –.” React, reactjs.org/docs/refs-and-the-dom.html. [11] Node.Js. “Documentation.” Node.Js, nodejs.org/en/docs. [12] Docker. “Docker Docs.” Docker, https://docs.docker.com. JETIR2205551 Journal of Emerging Technologies and Innovative Research (JETIR) www.jetir.org e424
You can also read
