SvelteKit

Alright folks, let's cut the crap. We know web dev can be a brutal grind. Django for the backend, SvelteKit for the frontend—sounds perfect, until you try to make them work together. Endless configs, dependencies throwing tantrums, and a heap of wasted nights.Pain In The Ass? Let’s Fix It 🎯We’ve all been there:Backend Ready: Django's solid, backend is rolling.Frontend Dream: SvelteKit is ready to dazzle.Reality: Integration is a flaming dumpster fire. 🔥Enter Django Svelte Template 🦸‍♂️Screw the headaches. This template is your knight in shining armor. Pre-configured, smooth as butter. Clone it, run it, done.🚀 Getting Shit DoneClone the Repogit clone [email protected]:Bishwas-py/django-svelte-template.git Fire Up Django Backendcd django_backend python3 -m venv venv source venv/bin/activate pip install -r requirements.txt python manage.py migrate python manage.py runserver Spin Up SvelteKitcd svelte_frontend npm install npm run dev Set .env:SECRET_BASE_API=http://localhost:8000 Boom! You’ve got a working todo app to play with.Why Use This?Backend Power:Django: Steady and reliable.Djapy: Enhanced validation, swagger in dark-mode.DjangoKit: Smooth Django-SvelteKit integration.Frontend Magic:Svelte 5: Reactive, quick.@friendofsvelte/django-kit: Seamless connection to Django.Tailwind CSS: Style without the hassle.Insta-FeaturesAuto Flash Messages: Toasts on errors, no sweat.Form Handling: Handling & validation, out of the box.Notifier Store: Easy to use toast notifications.Why Give a Damn?Plug and Play: No more setup nightmares.Full-Featured: A ready-to-use todo app to kickstart your project.Seamless Integration: Django and SvelteKit are besties here.Ready To Roll? 🏎️💨Head to the repo, fork it, clone it, and start building. No more late nights swearing at broken builds. Just smooth, painless dev.Let's code smarter, not harder. 🌟Contributions are welcomed!

Deploying SvelteKit can be a tricky job, especially when you're doing it for the first time, unlike me. But, after a few deployments, you get used to with it. So, today, I am guiding you through it, and giving you exact ways to deploy and run your SvelteKit in the server.Also, will be talking about something that I personally developed, called svelte-deploy command.SvelteKit configurationFirst of all, you need a module to be installed in your sveltekit project, @sveltejs/adapter-node;npm install @sveltejs/adapter-nodeNow, you have to configure your svelte.config.js, by adding replacing that upper module with @sveltejs/adapter-auto;import adapter from '@sveltejs/adapter-node'; // ^ // replace @sveltejs/adapter-auto | const config = { preprocess: [ vitePreprocess(), preprocess({ postcss: true }) ], ...Now, your SvelteKit setup is almost done.Server setupIf you have installed git in your Lightsail server then what you have to do is, clone your repo to a specific folder.Creating a service setupNow, we need to create a service setup /etc/systemd/system/<your_svelte_service_name>.service:[Unit] Description=SvelteApp After=network.target [Service] User=root Group=www-data WorkingDirectory=/home/ubuntu/svelte-apps/<path-to-your-app> ExecStart=/home/ubuntu/.nvm/versions/node/v19.8.0/bin/node /home/ubuntu/svelte-apps/<path-to-your-app>/build/index.js Environment=PORT=3099 ORIGIN=https://yoursite.com [Install] WantedBy=multi-user.targetMake sure you have installed NodeJs, suggested to installed it using nvm. You can see learn about installing nvm here.And to checkout the path of your current running node, use whereis node, and paste your preferred node to ExecStart=path_to_node path_to_index.jsNginx Setupupstream sveltekit-frontend { server localhost:3099; } server { listen 80; listen [::]:80; set $app_dir "/home/ubuntu/svelte-apps/<path-to-your-app>"; # not required server_name yoursite.com; location / { proxy_pass http://sveltekit-frontend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; } }Now, run;sudo nginx -tIf result is:nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successfulIt's usually good, and you're ready to go. (if not, ask below, happy to help)Restart the servicesNow, restart the nginx and the created services:sudo systemctl enable <your_svelte_service_name>.service; sudo systemctl start <your_svelte_service_name>.service; sudo systemctl restart nginx.service;Done, now your site is up and running. Lemme know if you need help.Have a good day 😊

Hello Community,In recent months, I have found myself significantly drawn towards Svelte while working on a personal project involving various JavaScript frameworks. The simplicity and effectiveness of Svelte appealed to me, to the extent that I've dedicated considerable time to learning it, subsequently acquiring a good understanding of its tools and utilities.A thought I've been entertaining recently revolves around the possibility of adopting Svelte as a core competency in my professional career. The subject of my query today, thus, concerns the viability of obtaining a job centered on Svelte usage. To what extent does the job market favor individuals well-versed with Svelte? Is a transition to such a role recommended, and if so, how challenging is it to secure such a position? I eagerly await your input and any guidance you might be able to provide on this matter.Thank you.

Hey developers. I am planning to develop a simple quick content publish platform that does some AI stuff on the backend, and needs basic auth and permissions, while developing it quickly, what could be best quickest and easiest possible stack for me? Phoenix Framework, SvelteKit/Postgresql or Django/Python?

Hello everyone,I'd like to take this moment to introduce you to an incredibly resourceful project called "Friend Of Svelte". This community-driven initiative is dedicated to helping developers using Svelte, a revolutionary framework for building user interfaces, by developing and curating high-quality resources tailored just for Svelte.Within the Friend Of Svelte community, members can find advanced tools like Tipex, a state-of-the-art rich text editor built upon robust frameworks like Tiptap and Prosemirror, which itself has been used in Webmatrices forum. We also provide easy-to-use actions, a dark mode toggle feature, and quick solutions for flash messages with our 'toasted' feature - all specifically engineered for Svelte and SvelteKit apps.Our main objective is to empower Svelte developers by providing resources that can help streamline and enhance their development process. Our org/community is open to all; whether you're a seasoned Svelte developer wanting to share your experience or a novice eager to learn, you're welcome to join us.We're more than just a community; we're friends. We believe that by fostering a supportive and collaborative environment, we can contribute to the growth and success of Svelte developers worldwide. Whoever you are, wherever you are from, if you love Svelte as we do, we invite you to be our Friend Of Svelte and make the world of web development a better place together.