Skip to content

Commit 12cc246

Browse files
committed
Add first article
1 parent 7d6d280 commit 12cc246

File tree

3 files changed

+318
-40
lines changed

3 files changed

+318
-40
lines changed

src/assets/state/articles/1.jsx

Lines changed: 312 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,312 @@
1+
import { people } from "../team";
2+
import tags from "./tags";
3+
4+
import thumbnail from "@/assets/images/content/blog/1/thumbnail.webp";
5+
6+
import A from "@/components/pages/blog/post/ArticleComponents";
7+
8+
const clients = {
9+
ghDesktop: {
10+
name: "Github Desktop",
11+
link: "https://desktop.github.com/"
12+
},
13+
sourceTree: {
14+
name: "SourceTree",
15+
link: "https://www.sourcetreeapp.com/"
16+
},
17+
gitKraken: {
18+
name: "GitKraken",
19+
link: "https://www.gitkraken.com/"
20+
}
21+
};
22+
23+
/** @satisfies {import("./article").default} */
24+
export default {
25+
title: "Introducing Commit Rocket! 🤩",
26+
27+
thumbnail,
28+
thumbnailAlt: "The Commit Rocket Logo",
29+
30+
vertical: "technology",
31+
32+
slug: "introducing-commit-rocket",
33+
tags: [
34+
tags.intro,
35+
tags.commitRocket,
36+
tags.news,
37+
{
38+
name: "Planned Features",
39+
hidden: true
40+
},
41+
{
42+
name: "Explanation",
43+
hidden: true
44+
},
45+
{
46+
name: "Our Inspiration",
47+
hidden: true
48+
},
49+
{
50+
name: "What is Commit Rocket",
51+
hidden: true
52+
}
53+
],
54+
55+
author: people.rik,
56+
57+
created: new Date("2023/04/10"),
58+
59+
teaser: "Learn about how \"Commit Rocket\", our new in development Git client, came to be and what we have planned for it!",
60+
content: <>
61+
62+
<A.Container className="text-xl">
63+
<p>
64+
Git is the backbone of modern software development, allowing developers to collaborate and maintain version control with ease. As part of our Git workflow we usually include a Git client, however many of the current options are outdated, slow, or simply not intuitive to use.
65+
</p>
66+
67+
<p>
68+
<strong>What if... it didn't have to be like that?</strong> If you are anything like us, we feel like this takes away from the gains you get from using a Git client. That's why we created Commit Rocket - a next-generation Git client that puts user experience first. With Commit Rocket, you'll never have to sacrifice functionality for ease of use. Join us as we aim to revolutionize the world of Git clients.
69+
</p>
70+
71+
<p>
72+
Jump ahead:
73+
</p>
74+
</A.Container>
75+
76+
<A.TOC excludeIds={["thank-you-for-reading"]} />
77+
78+
<A.H2>
79+
What is Commit Rocket?
80+
</A.H2>
81+
82+
<p>
83+
Commit Rocket is a new, modern Git client that is currently in development. We aim to provide a refreshing and innovative approach to Git clients by addressing the outdated looks and slow technologies many of the current options choose. Our main focus is on creating a modern design, fast performance, and an intuitive user experience while retaining all the features you love about other Git clients, like the commit history graph, stashing and more. With Commit Rocket, we are bringing new life to Git clients by bringing never before seen features to Git clients, but more about that later.
84+
</p>
85+
86+
<p>
87+
Once Commit Rocket is far enough into development, it will be open-sourced, meaning that everyone will have access to our code, and anyone can contribute to make it the best it can be. During development we will attempt to actively involve the community in the process with surveys, development insight videos and newsletters.
88+
</p>
89+
90+
<A.H3>
91+
Why Another Git Client?
92+
</A.H3>
93+
94+
<p>
95+
Before going into what we have to offer, lets have a look at why we are making a new Git client, and more importantly, why it is even nessesairy!
96+
</p>
97+
98+
<A.H4>
99+
Outdated Looks
100+
</A.H4>
101+
102+
<p>
103+
A lot of the clients that you can find today on <A.Link color="primary" href="https://git-scm.com/downloads/guis" external>Git's official Git client list</A.Link> have outdated visuals (except <A.Link href="https://www.gitkraken.com/" nofollow external>GitKraken</A.Link>, <A.Link href="https://gitnuro.jetpackduba.com/" nofollow external>Gitnuro</A.Link> and <A.Link href="https://gitviewer.com/" nofollow external>GitViewer</A.Link>). Visual appeal and user experience may not persé go hand in hand, but it can be argued that outdated visuals can put people off from using the client and having an overall enjoyable experience. This is especially important when you have a client with a lot of functions like <A.Link href="https://www.sourcetreeapp.com/" nofollow external>SourceTree</A.Link>.
104+
</p>
105+
106+
<p>
107+
We recognize the fact that form should not follow function, but that it should be paired with function. That is why we will be spending a significant amount of our resources to making a good looking user interface that is beginner friendly, and also provides the best user experience we can muster.
108+
</p>
109+
110+
<A.H4>
111+
Missing Features
112+
</A.H4>
113+
114+
<p>
115+
Ofcourse not everything is about looks, so lets talk about functionality and features! We also understand that missing features can be a deal-breaker for many developers. That's why we've compiled a list of common features that we felt were missing from even the most popular Git clients on the market.
116+
</p>
117+
118+
<A.Ls>
119+
{[
120+
{
121+
feature: "Commit History Graph",
122+
clients: [clients.ghDesktop]
123+
},
124+
{
125+
feature: "Pull Requests",
126+
clients: [clients.sourceTree]
127+
},
128+
{
129+
feature: "Repository Management",
130+
clients: [clients.gitKraken, clients.ghDesktop, clients.gitKraken]
131+
},
132+
{
133+
feature: "Multi-account Support",
134+
clients: [clients.ghDesktop]
135+
},
136+
{
137+
feature: "Merge Conflict Tool",
138+
clients: [clients.ghDesktop]
139+
},
140+
{
141+
feature: "Git Actions",
142+
clients: [clients.ghDesktop, clients.sourceTree]
143+
},
144+
{
145+
feature: "Git Submodules",
146+
clients: [clients.ghDesktop]
147+
},
148+
{
149+
feature: "Git Hooks",
150+
clients: [clients.ghDesktop, clients.sourceTree]
151+
}
152+
].map(({ feature, clients }, i) => (
153+
<A.Li key={i}>
154+
<strong className="font-semibold">{feature}</strong>
155+
<div className="pl-2 select-none text-xs font-semibold flex">
156+
(<ul className="flex gap-3">
157+
{clients.map(({ name, link }, j) => (
158+
<li key={j}>
159+
<A.Link href={link} nofollow external>
160+
{name}
161+
</A.Link>
162+
</li>
163+
))}
164+
</ul>)
165+
</div>
166+
</A.Li>
167+
))}
168+
</A.Ls>
169+
170+
<p>
171+
We recognize that some of our competitors, like Github Desktop, are designed to be lightweight, but we believe that even a lightweight client can offer powerful functionality, which is why we will eventually be including all of these features in Commit Rocket.
172+
</p>
173+
174+
<A.H4>
175+
No Customizability
176+
</A.H4>
177+
178+
<p>
179+
Another feature we feel is severly lacking in most clients is the customizability. Not only in theme but also in layout. Not everyone likes the same layout, which is only reasonable. Most Git GUI Clients only offer a limited amount of customizability, which usually is a few preset themes. <A.Link href="https://www.gitkraken.com/" nofollow external>GitKraken</A.Link> and <A.Link href="https://gitnuro.jetpackduba.com/" nofollow external>Gitnuro</A.Link>, do actually offer full theme customizability, but no customizability in layout.
180+
</p>
181+
<p>
182+
We believe that customizable layouts can increase productivity. In a basic sense creating your own layout should help, because you know where everything is and you can remove features you don't need to have at that certain moment in time, decreasing your mental overhead.
183+
</p>
184+
185+
<A.H4>
186+
Slow Speeds
187+
</A.H4>
188+
189+
<p>
190+
A <strong className="font-semibold">lot</strong> of Git Clients make use of <A.Link href="https://www.electronjs.org/" nofollow external>Electron</A.Link>, which is a big reason why these clients are slow. Electron itself is used in a lot of other products, like Gitkraken, Github Desktop, VSCode, Dicord and more. Electron allows developers to use web technologies on desktop, however this comes at the cost of having high memory usage and slow performance. On top of that, clients like GitKraken use Nodegit which exposes a wrapped Git API to JavaScript, which takes away additional performance. Github Desktop takes a different approach, they use the CLI and parse the output text.
191+
</p>
192+
<p>
193+
Both of these approaches are not great for performance, which is why we suggest an alternative. This alternative comes in the form of <A.Link href="https://tauri.app/" external>Tauri</A.Link>. Just like Electron, Tauri allows developers to user JavaScript, HTML and CSS for their presentation layer. Unlike Electron however it allows for business logic to be written in Rust. Rust its speed is incredably fast, which is why it is ideal for writing the (performance critical) logic. The presentation layer can invoke a function in Rust to get the nessesairy data. Essentially what we can do is write an easy to develop presentation layer, while having an incredably fast logic layer without sacrificing any performance.
194+
</p>
195+
<p>
196+
Our alternative to using <A.Link href="https://www.nodegit.org/" nofollow external>Nodegit</A.Link> or invoking the CLI and parsing the results is using <A.Link href="https://libgit2.org/" external>Libgit2</A.Link>. Nodegit is a JavaScript binding of Libgit2, however we will be using a <A.Link href="https://github.com/rust-lang/git2-rs" external>Rust binding of Libgit2</A.Link>, which will be a lot faster. This is because invoking C code from Rust is faster compared to invoking it from JavaScript, in addition to that, Rust is already faster then JavaScript; so this will result in a massive speed increase.
197+
</p>
198+
199+
<A.H3>
200+
Our Inspiration
201+
</A.H3>
202+
203+
We didn't think of the idea to make Commit Rocket on our own. Commit Rocket came to the forefront of our minds due to some cool products that inspired us. Our main inspirations were the Arc browser and Tauri, both of which are really unique and (to our belief) game changing products.
204+
205+
<A.H4>
206+
<A.Link href="https://arc.net/" nofollow external>Arc</A.Link>
207+
<div className="text-sm">By: The Browser Company</div>
208+
</A.H4>
209+
210+
<p>
211+
We love the way that Arc looks. It is very different compared to other browsers, not just in looks but also in functionality. Despite it being based on Chromium, it has some really cool new ideas, like notes, easels and spaces. If you haven't yet, I recommend checking out <A.Link href="https://www.youtube.com/@TheBrowserCompany" nofollow external>The Browser Company's youtube channel</A.Link> to see what Arc is about. For us personally we would like to do the same Arc is doing, changing Git clients in meaningfull ways. What that way is however, is to be determined.
212+
</p>
213+
214+
<A.H4>
215+
<A.Link href="https://tauri.app/" nofollow external>Tauri</A.Link>
216+
<div className="text-sm">By: Tauri Studio</div>
217+
</A.H4>
218+
219+
<p>
220+
As discussed in <A.Link href="#why-another-git-client" >"Why Another Git Client?"</A.Link> we will be using Tauri as our basis for making our desktop application. The promising speed increases over Electron were really attractive. It is written in Rust, which makes it ideal for consistent and speedy performance without taking up too much memory. All very good qualities to have for a Git client. Tauri will be the back bone of Commit Rocket, and we will be making full use of the features they have to offer.
221+
</p>
222+
223+
<A.H2>
224+
Planned Features
225+
</A.H2>
226+
227+
Our vision for Commit Rocket is feature packed and super customizable. Naturally we will include the normal Git functionality, but we will also be adding never before seen features, like plugin support and layout customizability. We will discuss all of our planned features at length in a future article, but for now we will briefly discuss our major planned features.
228+
229+
<A.H3>
230+
Advanced Repository Management
231+
</A.H3>
232+
233+
<A.Ls className="gap-8">
234+
<A.Li>
235+
<A.Container className="gap-4">
236+
<A.H4 className="text-xl md:text-xl">Pull/Merge Requests</A.H4>
237+
<p>
238+
The mainstream Git clients GitKraken and Github Desktop both have quick ways to view your pull requests. Github Desktop only allows you to view Github pull requests, but it has the feature nonetheless. We plan to implement this as well, but for all major Git hosts (e.g. Gitlab, Github, Bitbucket).
239+
</p>
240+
</A.Container>
241+
</A.Li>
242+
<A.Li>
243+
<A.Container className="gap-4">
244+
<A.H4 className="text-xl md:text-xl">Git Actions</A.H4>
245+
<p>
246+
Just like pull requests, Git actions seem to be a platform specific implementation. We've only seen Gitkraken implement this feature, but we thing that this would be an amazing functionality to have out of the box.
247+
</p>
248+
</A.Container>
249+
</A.Li>
250+
<A.Li>
251+
<A.Container className="gap-4">
252+
<A.H4 className="text-xl md:text-xl">Repository Management</A.H4>
253+
<p>
254+
A feature we haven't seen any Git GUI client do so far is repository management. This means being able to change the settings of your repostiory from the comfort of your client. Having that would save a lot of time going back and forth to your repository in the browser.
255+
</p>
256+
</A.Container>
257+
</A.Li>
258+
</A.Ls>
259+
260+
<A.H3>
261+
Theming & Layouts
262+
</A.H3>
263+
264+
<p>
265+
Git clients have a pretty standard layout and theme. Usually some blue-ish darkmode combined with a layout that has your commit graph, staging area and diff-viewers. This layout will work fine for a lot of people, but what if you wanted something different? What if you wanted to prioritize Git actions for example? You simply can't.
266+
</p>
267+
268+
<p>
269+
Our solution to this is a flexible module system, where panels can freely be dragged to where you want them to be. In addition, we will have full theming support, where you can change every color to whatever you want it to be. Lastly, although it is not set in stone yet, we would like to implement a theme and layout marketplace, which would allow you to share your favorite layouts with the community.
270+
</p>
271+
272+
<A.H3>
273+
Plugins
274+
</A.H3>
275+
276+
<p>
277+
Our last <em>(and favorite)</em> major feature we want to talk about... <strong className="font-semibold">plugins!</strong> We realized that plugins can be very powerful after seeing the ecosystem that apps like VSCode or Obsidian have built up. We would like to add an extensive plugin API for developers that would allow for the craziest things, like a Jira integration, Vim keybindings or motivational quote generator, you name it!
278+
</p>
279+
280+
<A.H2>
281+
The Future!
282+
</A.H2>
283+
284+
<p>
285+
If this article got you hyped over the development of Commit Rocket and the ideas that we have, then you might be curious as to what our timeline looks like.
286+
</p>
287+
288+
<A.H3>
289+
Roadmap & Support
290+
</A.H3>
291+
292+
<p>
293+
Well, first of all, you can find <A.Link href="/#roadmap">our roadmap</A.Link> on the frontpage of our website. As always, this roadmap is subject to change. Second, if you are really excited, make sure to <A.Link href="/#sign-up">sign-up to our newsletter</A.Link> and <A.Link href="/contribute#feedback">send us your ideas</A.Link>.
294+
</p>
295+
296+
<A.H3>
297+
Monitization
298+
</A.H3>
299+
300+
<p>
301+
At last, you might want to know what our plans are for monitization. Even though we haven't thought of a definitive strategy yet, we will likely be making use of a donation based model, somewhat similar to Signal. We could also possibly do something with sponsors, like what <A.Link href="https://github.com/withastro/.github/blob/main/FUNDING.md" nofollow external>Astro</A.Link> is doing. Again it is a bit too early to be giving promises, but since we want this product to be accessible to everyone, we have no motivation to make use of a subscription model, that is for sure.
302+
</p>
303+
304+
<A.H2>
305+
Thank You for Reading!
306+
</A.H2>
307+
308+
<p>
309+
We really want to make Commit Rocket as awesome as possible. I hope all of you will stick around to see how this will turn out!
310+
</p>
311+
</>
312+
};

src/assets/state/articles/1.tsx

Lines changed: 0 additions & 39 deletions
This file was deleted.

src/assets/state/articles/index.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
import IArticle from "./article";
22

3-
export default [
3+
import article1 from "./1";
44

5+
export default [
6+
{
7+
filename: "1",
8+
article: article1
9+
}
510
] as { filename: string; article: IArticle }[];

0 commit comments

Comments
 (0)