Let's try understanding common challenges faced while building fullstack applications, We built an experimental fullstack framework that solves a lot of issues faced while developing apps using traditional methods. Combining the mordern tech with ease of API integration gluestack framework will prove to be your go to app development platform for any use case. The talk explains how we managed to solves these challenges and why we did it. For more information regarding the same lets connect on twitter. Twitter handle: @VidhiKataria2 Talk link: https://www.youtube.com/live/JuedZFbhyL0?si=yyXy_V5LwlWjjVDL&t=25584

1. Namaste!
"
"

2. Senior Software Engineer
Vidhi Kataria
@VidhiKataria2

3. @VidhiKataria2

4. MAKE DEVELOPMENT FASTER
- GeekyAnts

6. Nativebase

7. Nativebase Builder
Nativebase

8. Nativebase Builder
Nativebase
Design system creator

9. Previously....

12. Plugins
ORM
Plugin
!

13. Plugins
ORM
Plugin
Prisma ORM
!

14. Plugins
ORM
Plugin
Prisma ORM
!

15. Plugins
ORM
Plugin
Prisma ORM Drizzle ORM
!

16. Plugins
ORM
Plugin
Prisma ORM Drizzle ORM
!

17. Plugins
ORM
Plugin
Prisma ORM Drizzle ORM
!

18. !

20. Build yet another fullstack
javascript framewor
k️

21. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation

22. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Complexity

23. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Integration Issues
Complexity

24. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Integration Issues
Complexity
Data Consistency

25. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Authentication and Authorisation
Integration Issues
Complexity
Data Consistency

26. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Authentication and Authorisation
Scalability
Integration Issues
Complexity
Data Consistency

27. Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Authentication and Authorisation
Scalability
Performance Issue
Integration Issues
Complexity
Data Consistency

28. Integration Issues
Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation

29. Integration Issues
Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Still continuing….

30. Integration Issues
Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Still continuing….
Keeping up with the latest tech

31. Integration Issues
Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Still continuing….
Testing and Quality Assurance
Keeping up with the latest tech

32. Integration Issues
Complexity
Data Consistency
Scalability
Performance Issue
Authentication and Authorisation
Still continuing….
Version Control and Collaboration
Testing and Quality Assurance
Keeping up with the latest tech

33. Integration Issues
Complexity
Data Consistency
Still continuing….
Version Control and Collaboration
Testing and Quality Assurance
Keeping up with the latest tech

35. Universal

36. Fully Typed

37. Fast to adopt

38. Quick to handle

39. Improves your DX

40. And it is Pluggable

41. It’s Demo Time

43. Bootstrapping

46. Folder Structure
The folder structure of a newly bootstrapped gluestack app will look like this.
glue
package.json
{}
con
fi
g
>
.glue
>
Readme.md
!
.env

47. node glue add @gluestack-v2/glue-plugin-web web

48. node glue add @gluestack-v2/glue-plugin-service-gateway gateway

49. node glue add @gluestack-v2/glue-plugin-functions functions

50. node glue add @gluestack-v2/glue-plugin-database database

51. node glue add @gluestack-v2/glue-plugin-database-client dbClient
node glue add @gluestack-v2/glue-plugin-database-client dbClient
node glue add @gluestack-v2/glue-plugin-functions functions
node glue add @gluestack-v2/glue-plugin-service-gateway gateway
node glue add @gluestack-v2/glue-plugin-web web
node glue add @gluestack-v2/glue-plugin-database database

52. node glue add @gluestack-v2/glue-plugin-database-client dbClient
node glue add @gluestack-v2/glue-plugin-web web
node glue add @gluestack-v2/glue-plugin-service-gateway gateway
node glue add @gluestack-v2/glue-plugin-functions functions
node glue add @gluestack-v2/glue-plugin-database database

53. Web instance
fi
le structure

54. UI Codebase

55. DbQuery SDK

57. Challenges

58. Creating a pluggable architecture that
makes sense

59. Creating a pluggable architecture

60. • Multiple instances.
Creating a pluggable architecture

61. • Multiple instances.
• Communication between the Plugins.
Creating a pluggable architecture

62. • Multiple instances.
• Communication between the Plugins.
• Extensible.
Creating a pluggable architecture

63. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
Creating a pluggable architecture

64. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
Creating a pluggable architecture

65. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

66. Core
gluestack plugins
gluestack architecture

69. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

70. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

71. pluginName
pluginType
…
buil()
watcher()
class PluginInterface

72. Core
gluestack plugins
gluestack architecture
custom

73. Core
gluestack plugins
gluestack architecture
custom plugins

74. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

75. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

76. CLI App Instance
Plugin 3
node glue
Plugin 2
Plugin 1
CLI Env

79. ….. ….. dbclient
core
SDK
gateway
database

80. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

81. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

82. Your Instance
Build
Project Runner
Some error
Source map
By default error path
Final error path

83. Your Instance
Build
Project Runner
Some error
Source map
By default error path
Final error path

84. Your Instance
Build
Project Runner
Some error
Source map
By default error path
Final error path

85. Your Instance
Build
Project Runner
Some error
Source map
By default error path
Final error path

86. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

87. • Multiple instances.
• Communication between the Plugins.
• Extensible.
• Add or Remove.
• Dependency con
fl
icts.
• Debugging.
Creating a pluggable architecture

88. Deciding the tech stack

89. Fullstack
Application
Media Store
Database
Frontend
Backend

90. Fullstack
Application
Media Store
Database
Frontend
Backend

98. Fullstack
Application
Media Store
Database
Frontend
Backend

100. storage.service.js other services database.service.js
handler()
microservices
handler()

101. database.service.js
microservices
storage.service.js other services
handler()
client
server
SDK
client
SDK
handler()
broker call
axios call
clientSDK call
axios call
broker call

103. Edge Functions
User
Europe
Edge
Function
User
America
Edge
Function
User
Asia
Edge
Function
DB
replica
DB
replica
DB
replica

104. Fullstack
Application
Media Store
Database
Frontend
Backend

105. not possible due to
security reasons
Database
Frontend app
Backend app
request query response
with results
response using a rest API
response from server

106. not possible due to
security reasons
Database
Frontend app
Backend app
request query response
with results
database.service.js
ORM (prisma)
response from
server
request data
from SDK
response from
service
request using
axios call
Database client
SDK

110. Fullstack
Application
Media Store
Database
Frontend
Backend

112. Deploy & Run

115. Experimental