NewStats: 3,263,647 , 8,180,890 topics. Date: Saturday, 07 June 2025 at 02:58 AM 1m6tj6z3e3g |
My Journey Into Svelte Development (3720 Views)
(1) Go Down)
qtguru(m): 2:23pm On Apr 11, 2022 |
I am currently working for a company who uses the Svelte framework for their product, I will be posting Svelte concepts and tasks I deal with , so you can learn Svelte faster and better from my posts. Pls feel free to share questions on Svelte and JS 8 Likes |
3exe3: 2:25pm On Apr 11, 2022 |
What language framework
|
qtguru(m): 2:36pm On Apr 11, 2022 |
It is JavaScript , but it uses AST to generate JS code for your application. so whatever you write is compiled into JS
1 Like |
Johnmattee(m): 4:14pm On Apr 11, 2022 |
AST is analogous to JSX in React
|
qtguru(m): 4:17pm On Apr 11, 2022 |
Johnmattee: Hmmm you know I have never thought about it that way, but I think I agree, because JSX is broken into token and mapped to function, so definetely something is parsing JSX. I will have to agree, they are somewhat comparable. |
qtguru(m): 4:24pm On Apr 11, 2022 |
This is the Application built in Svelte one thing you need to know about Svelte 1. routes on the browser are mapped to folder like Nuxt.JS 2. Script , Style and template is all that is required for a Svelte Component 3. Stores are observable 4. Svelte runs with Sapper which is SSR in nature 5. Svelte is reactive, it is built with reacitivty in mind 6. Svelte has no VirtualDOM 7. Svelte is not complex as React, by far the easiest framework to get into Here is a screenshot of what Svelte Code looks like 2 Likes |
Johnmattee(m): 5:26pm On Apr 11, 2022 |
qtguru:Okay! but how well can you compare it with React in of performance and learning curve? |
peterincredible: 5:29pm On Apr 11, 2022 |
Sorry Bros but I have to ask u I have used react and currently using Vue js and I can tell u I have forgotten most of the things I know when I was working with react but you work with several frameworks and several programming languages how do u even keep up with every thing at the same time
|
qtguru(m): 5:43pm On Apr 11, 2022 |
peterincredible: Good question, every framework has a paradigm, so I try to understand it. React is written to be Component based, Props and States, Redux for updating state and props globally once you have a basic understanding it is easy to grasp things. But I have a very strong JavaScript knowledge and also knowledge of how these frameworks compile/transpile to JS. Once you have that understanding, the rest is just syntax and libraries. As for other programming languages, the more you code in them, you more you get familiar with them. But I am not an expert at every language, I just some syntax and consult the documentation when I need to. no one can cram everything 13 Likes |
qtguru(m): 4:56pm On Apr 16, 2022 |
I wrote a long text, but it had too many grammatical errors, React 16 creates Error Boundaries, JavaScript codes are no longer the same type of development; as compared to earlier years of coding. Today's JS code via frameworks usually goes through a form of transpilation, something like babel. Svelte(node) uses the acorn library to parse your source (The JavaScript section) and generate an efficient and Svelte-ish type of application. When a page is written in traditional HTML and JS, during a reference error, it simply throws an error with the application still functioning. However, in generated codes like React/Svelte, a simple bug is enough to mess up the internal state and bring the application down. Perfect code is a myth. Which brings us to our current dilemma, how do I handle this issue? Attached to the post; is a screenshot of a library that handles the error thrown by the Svelte component. The first screenshot shows the SvelteComponent as this is what your code written in Svelte files is transformed into. It is very important to the context of the issue at hand. Every logic written in Svelte runs under the context of a SvelteComponent. An author armed with that knowledge simply extended the internal state of the Svelte component to augment and monkey-patch (refers to augmenting an existing Object, this is possible in JS naturally, as other languages might need some form of Reflection to do this) the render method. I wanted to share that because the obvious normal thinking process for a surface level Svelte developer is to wrap each function of the code into a try/catch causing a massive duplication in each code. How does a developer think to extend the internal SvelteComponent ? Answer by understanding how the framework works and how the code is generated. The second screenshot shows the extension of the SvelteComponent to handle errors. It's easier to fix at the compiler level, when each component is generated, it simply returns an extended class of the Component when required in runtime. Anyway, thanks for reading and I hope you enjoyed the post. If you want more information about the internals of Svelte I will advise you to read Compile Svelte in your head and look up the source code. [b]FUN FACT: [/b]If you press the dot button on your keyboard in a git repository, it renders a VSCode environment making it easier to follow the flow of the code. FIN 2 Likes |
Re: My Journey Into Svelte Development by Nobody: 1:16am On Apr 20, 2022 |
@qtguru Do you use Sveltekit or Sapper? |
qtguru(m): 1:37am On Apr 20, 2022 |
DrLevi: Sapper there's too much code to migrate to Sveltekit maybe in the future. 1 Like |
truthCoder: 4:45am On Jun 12, 2022 |
Nice to see this thread. I have been building projects with sveltekit for some time now and it has been amazing. Sveltekit plus tailwind makes coding flow directly from my brain to the IDE. As i am thinking it, so i am writing it. I hope more people would adopt svelte gping forward |
chieni(f): 5:35pm On Jun 29, 2022 |
Cc Qtguru Hello good day. Sorry for calling you out of the blues. I you mentioned you used a Samsung galaxy note 9 in one of your posts in your diary. Do you still think its worth it in of the camera and video quality ? In fact generally speaking. I would appreciate your input as I plan on getting one. Thank you.
|
qtguru(m): 5:40pm On Jun 29, 2022 |
chieni: It is and it shoots 4k Video, the image quality is good, let me share a pix I snapped with it, it also comes with Enterprise Features and Bixby(It can alter Camera Shoot mode based on the subject, it can detect if an item is food, shoe etc). 1 Like |
chieni(f): 6:27pm On Jun 29, 2022 |
qtguru:Alright. Thank you so much for the response. |
qtguru(m): 11:02am On Aug 14, 2022 |
I took over Svelte-devtool from RedHatter There is no official Svelte Devtool, and the author has stopped maintaining it, I had to fork it because we need it for work, our debugging workflow is too slow. Since I forked this Project I have migrated to Manifest Version 3 and re-writing some deprecated API to work against version 3 the only goal is to have it running. The concept is the same as ContentScript except Devtool communicates with Background , Content Script talks to Background Worker which talks to Devtools. I will attach some notes here
|
LikeAking: 11:33am On Aug 14, 2022 |
qtguru: Beta than React. |
qtguru(m): 6:28pm On Aug 15, 2022 |
qtguru(m): 6:38pm On Aug 15, 2022 |
Please if this extension finally runs , I will need those on sveltekit to test it out. I am still using sapper.
|
qtguru(m): 12:39pm On Aug 24, 2022 |
Closed Read on dojovader.github.io |
devmek: 12:23pm On Aug 29, 2022 |
Good afternoon Sir and welcome back from your leave, please regarding your former intern that just got a new job, will you be needing a new intern? Thank you sir. qtguru: |
qtguru(m): 12:30pm On Aug 29, 2022 |
devmek: Yes I don't mind, my email is on my website, I don't want to be blocked, send a mail, I don't mind, I have some stuffs. You have basic javascript and React knowledge? 6 Likes |
Fourpockets: 1:34pm On Aug 29, 2022 |
qtguru:Good afternoon sir Is the position paid or free |
devmek: 1:38pm On Aug 29, 2022 |
Yes sir, I do, I will send an email attached with my resume. Thank you qtguru: |
ajsans: 5:49pm On Aug 29, 2022 |
qtguru: Hello Sir, I sent you a PM, it's regarding your post regarding ui/ux design in your slack. |
qtguru(m): 9:56am On Aug 30, 2022 |
ajsans: I replied, |
devmek: 11:28am On Aug 30, 2022 |
Good morning Sir, I sent the email almost immediately yesterday qtguru: |
qtguru(m): 12:25pm On Aug 30, 2022 |
devmek: I haven't seen any mail, which mail did you send to ? It entered spam, seen 1 Like |
devmek: 12:33pm On Aug 30, 2022 |
Okay sir, thank you qtguru: |
qtguru(m): 12:49pm On Aug 30, 2022 |
devmek: I sent you a reply |
devmek: 12:59pm On Aug 30, 2022 |
I have sent a response Sir qtguru: |
(1) Reply)
Need School Management Software
(Go Up)
Sections: How To . 46 Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or s on Nairaland. |