Activity

Ahnaf

Shipped this project!

Hours: 1.1
Cookies: 🍪 13
Multiplier: 9.76 cookies/hr

Hi, this is my second ship, its mostly related to the main 2 optimizations I have done to the project so that I can achieve the Optimization achievement so nothing much to say, Please comment and give me feedbacks if you think I should improve anything else.
Thank You <3

Ahnaf

This devlog mostly focuses on the max optimization of the project since the last time I was not able to achieve the optimization achievement. And I have done the optimization mainly based on two criteria, which are lazy loading to multiple elements, and optimization of asset sizes. More detailed insight into the optimizations done is available with proof in the README.md. Here, I have just posted a some images of optimization proof below.

Attachment
Attachment
Attachment
0
Ahnaf

Shipped this project!

Hours: 2.48
Cookies: 🍪 22
Multiplier: 7.15 cookies/hr

PLS READ: Eventhough, the purpose of the app has been mentioned many users who are new to such projects get confused, so in simple words, my project is made using python and this project is used for building SIMPLE apps out of pure html css and js codes.
This is my second ship, here most of the work were related to optimization techniques since on last ship I was not able to achieve the optimization achievement due to lack of proof and real work done, So I hope I have fixed all my mistakes now. Thank You!

Ahnaf

I have updated the README.md with 2 major optimization techniques that I have used in the project, and also updated the repo with some codes, that help in further optimization, since in my last devlogs, ships and previous readme, real optimization and their proof were not shown. So this devlog is fully dedicated on adding lazy loading techniques and asset/app size minimization with proof (ive attached image of one proof here). Check the README for detailed info.

Attachment
0
Ahnaf

Shipped this project!

Hours: 7.36
Cookies: 🍪 193
Multiplier: 21.88 cookies/hr

PLEASE READ: Many people might question the usability of this, and why it is efficient if the whole code is present as base64 encoded format in the embed itself?

  • Well, many tech sites use these embeds for showcasing command lines and short lines of codes for various languages and purposes, and most snippet makers require api and sign up but Codesplay does not require these.
  • And if you think having all the raw codes (in base64) in the embeds kill its main purpose of being compact, people mostly use snippet for about 4-15 lines of code on average. And the plus point is its all local and less chance to be messed up if API is on downtime.
Ahnaf

Last and final devlog, everything was checked properly for proper functioning and the project comes to an end. I hope it help others in the way it is intended to use. For this final update, after quite lots of prompt I used Kilo to encode the embed codes in base64 since it was way too complex and I added image downloads using html2canvas lib . (btw the horizontal slider/scroller wont appear in embed or images of the snippet.)

Attachment
0
Ahnaf

Easy peasy work, just had to take the vscode snippet, remove some parts, redesign into a simpler header for it, forgot to add the copy code button lol, gonna wake up tmrw and do that.
And not only that, snippet image download buttons and embed copy must be added too, So I have reserved some space below each snippet.

Attachment
0
Ahnaf

Perfected the vscode snippet, after lots of experimenting, and here it is. The next snippet will be based on Mac window, basically the default look of most snippets. I’m still trying to brainstorm other snippet ideas. So please let me know in the comments if you have your idea.
What was added in this update:

  • A copy button
  • A vscode replica footer
Attachment
0
Ahnaf

Just added the vscode snippet, I tried to make it as good as possible but well we cant just copy the whole ide design lol. So, I added a way to resize the snippet in both x and y axis, so that you can get an appropriate image if you are downloading the snippet. I have also added vscode lookalike syntax highlighting based on the new vscode theme.
On the next update ill be adding a Mac window snippet, if you guys have more idea for snippet themes, please let me know in the comments…

Attachment
0
Ahnaf

I almost gave up trying to hackatime, cuz on my ancient win 7 32 bit pc (my parents locked up my laptop), basically no modern apps work 😭, finally I found some site that gives a cloud VS Code IDE and then I was able to get wakatime to work. I have added some small updates after minutes and minutes of experimenting with best css styles that I can make. The key things done are:

  • Added a font adjustment slider.
  • Added snippet title textbox.
  • Added language slider.
  • Shifted the input window to the left.
Attachment
0
Ahnaf

After thinking and changing lots of styles, I concluded to go with Apple’s glassmorphism style for the UI, At first I added a Mac inspired window title bar. And then for the area to enter the code, I have added glassy feel to the background. For now I just made the input area, and will make the output area similar to it on the left with buttons for copy and download. In the update, I will be adding the option to scale the font and choose a language so that the parts of the codes make sense.

Attachment
0
Ahnaf

Updated Devlog: I actually found a way to clone the directories and files of the project through this package! Check the read me for updated instructions.

Old Devlog: After lots of errors once again we have accomplished another target, I reserved a PyPI package namespace for my project. It might not seem helpful for us right now, but when the project grows, we might need it. Fyi, It does pretty much nothing as of now other than holding the name, because later on we might not find the desired name for the package, so don’t try installing it.

Attachment
0
Ahnaf

After lots and lots of debugging from previous codes regarding compatibility issues across various versions of Windows 10/11, I have finally fixed it by simplifying the codes. Instead of using two Python files to manage, which were one for icons, libraries, etc., and another for creating the window. I have just kept the one for creating a window and handling the icon through the commands.
Here are the major fixes done:

  1. Optimization: Decreased the number of files.
  2. Compression: .exe is alone a single app now, does not depend on any directory like /.internal
  3. Fixed icon: Sometimes icons did not appear, patched that through commands.
  4. Compatibility issues: Fixed WebView2 errors.
0
Ahnaf

Shipped this project!

Hours: 1.3
Cookies: 🍪 10
Multiplier: 7.36 cookies/hr

Last time in summer of making I built a browser with electron, later on I thought. Why would someone use a browser that was made on a browser itself? It was basically a bloat house with file size going over 150MB! Then I thought why could’nt we use python, afterall that is a good old language that can be used to great project. Soon I learnt about the webview of python (pywebview) and that gave me and idea. So I used it to render html instead of flask and then package it as .exe (I’ll think of adding other platform support later on) with another library (pyinstaller). And BOOM. now a simple idea turned into an actual game changer for making simple apps. It did not require much effort thanks to those libraries and a fabulous brain that god gifted us all!

Ahnaf

This is a very simple frame project made only using pyinstaller for packaging of app and pywebview to show the html/css/js content.
What was done:

  • project created and worked with adding the required libraries. (added in requirements.txt)
  • used –onedir and –strip for optimization and many others.
  • debugged the project for common issues.
  • packed app was tested for any bugs
  • crafted readme.md
Attachment
0
Ahnaf

Shipped this project!

Hours: 5.78
Cookies: 🍪 83
Multiplier: 14.35 cookies/hr

I built a WebOS for the sidequest; certain things, like making an actual glassy ui and working with JS functions, were really challenging, but I made it through. I’m really proud of how it looks quite similar to how a real os looks.

Ahnaf

Plex OS | A Web OS (sidequest)
Update to: Home Screen (70% done)

  • Added apps
  • Added start menu
  • Added floating app windows
Attachment
0
Ahnaf

Plex OS | A Web OS (sidequest)
Update to: Home Screen (15% done)

  • Added clock (slightly hidden behind background)
  • Added taskbar with icons (icons are originally made for the project and are not stock photos)
Attachment
0
Ahnaf

Plex OS | A Web OS (sidequest)
Update to: Boot Screen

  • Added loading gif and logo (with slight grayscale to fit boot screen darkness).
  • Added auto-redirect without refresh to the lock screen.
  • Added booting text with slight blinking effect.
Attachment
0
Ahnaf

Plex OS | A Web OS (sidequest)
Update to: Lock Screen

  • Added welcome/info text
  • Added unlock button
  • Added news widget, crypto widget, and Spotify playlist.
Attachment
0
Ahnaf

Plex OS | A Web OS (sidequest)
Update to: Lock Screen

  • Added time
  • Added day, date, and year
  • Added temperature, condition, and battery bar
Attachment
0