Posts

Showing posts from June, 2024

Notes on regular UI Bhagavad Gita Nextjs web app. built on top of very simple Gita app.

Last updated on 3 Jul. 2024 Now I am starting the next step of using Tailwind and TypeScript in my  very simple Gita app and make it a regular web app. (regular web app UI + tighter and more robust code by using TypeScript). But it no longer will be a very simple Gita app. as the coding complexity will surely increase. First step is to add Tailwind to the existing project. Note that TypeScript is already setup in the project. It was just that I did not use it - I used .js/.jsx files instead of .ts/.tsx files. But Tailwind is not part of the very simple Gita app project. Based on: Setting up Tailwind CSS in a Next.js project section in https://tailwindcss.com/docs/guides/nextjs  : To install Tailwind CSS: npm install -D tailwindcss postcss autoprefixer npx tailwindcss init -p The above commands executed without any issues. Tailwind and postcss config files were created. --- Configure template paths: I used:   content: [     "./app/**/*.{js,ts,jsx,tsx,mdx}",     "./pages/

Notes on mobile/hamburger menu in web app

Last updated on 20 Jun. 2024 Quick Info mobile-menu-v18-w-anim version is a working version of my trial HTML, CSS and JS mobile menu. It provides a fully functional mobile menu, has a single menu for header (regular) and mobile, uses a list within nav element and has simple animation for mobile menu button. I think the code is still somewhat simple.  Webpage on GitHub Pages   ...  GitHub repository  . Details To get a better understanding of coding of mobile/hamburger menu in web apps, I am trying to convert the mobile menu in lesson04 of  Dave Gray's Tailwind tutorial , ...  Github source code  to plain HTML, CSS and JavaScript. I am doing it in stages. Given below are some notes from that trial. One small issue with Dave Gray Tailwind tutorial's mobile menu is that if the window height is reduced then one cannot scroll down to menu items that are not in view. But I think such a scenario is too odd and so this small issue can be ignored. --- From: Unicode character for "X

Put up a list of my deployed apps including learning/tutorial apps

List of my deployed apps/websites including learning/tutorial apps,  https://raviswdev.blogspot.com/p/list-of-my-deployed-appswebsites.html  . It is added to top-left menu item, "Key posts/pages" on home page of blog .

Windows Powershell scripts: Copy without node_modules and .next folders/directories; List node_modules and .next folders

Quick-Info CopyWoNmnx.ps1 Powershell script that copies contents of a folder/directory excluding node_modules and .next folders. It uses robocopy command to do the main work. ListNmnx.ps1 Powershell script that lists node_modules and .next folders in a folder/directory. It ignores subfolders within the node_modules or .next folders it finds. CopyWoNmnx.ps1 Powershell script My post:  Using robocopy to copy folder without node_modules subfolder(s) and using WinMerge and TreeSize to check , Mar. 2024 covers how robocopy can be used to copy folder without node_modules subfolders. Adding .next to node_modules as a subfolder to be skipped in robocopy command is trivial. CopyWoNmnx.ps1 source code on GitHub Gist CopyWoNmnx.ps1 is a convenience Powershell script that wraps above robocopy command usage. The script copies contents of a folder/directory excluding node_modules and .next folders. It uses robocopy command to do the main work. Usage: script-name Source-Folder-Name Output folder na

Notes about using proxy with curl and with Chrome browser

Last updated on 9 Jun. 2024 With Jio APN protocol and APN roaming protocol set to IPv4 from IPv4/IPv6 , I am not facing the blocking of sites like wordpress.com and github.com on Jio mobile Internet. Prior to getting that solution, on 4/5 June (2024) late night I was trying out proxy solutions. I learned some stuff about using command line curl which sometimes was able to access https sites through Windows manual proxy settings but which  sites under same Windows manual proxy settings were not accessible through Chrome or Edge browsers in not only Jio mobile Internet but also Airtel mobile Internet. To capture some of the knowledge picked up from these tests, I decided to do some of them again and capture it in this post. A pleasant surprise is that now https sites are working in Chrome (did not test Edge but I think it will work there too) when going through manual proxy set in Windows Settings. The following tests were done on 5th June 2024. The http proxy was picked up from https://

Notes: Git & GitHub: In project with main branch deployed to hosting site, using newfeature git branch for development and eventual merging into main branch

In the very simple gita app that I am working on now , as updates on its main branch on GitHub are set to automatically get deployed on Vercel, I wanted to do some development work (Go to chapter verse component) in a separate development branch where I could commit intermediate stage changes without it getting deployed to live site on Vercel. That needed me to get into branch stuff in git and GitHub. Given below are notes from that learning: https://www.atlassian.com/git/tutorials/using-branches seems to be a very interesting page explaining utility of branches and how to create and merge branches. 'git branch' - Lists branches. VSCode shows current branch in bluish-green colour and with an * before it. 'git branch <branch-name>' - Creates a new branch called <branch-name> 'git branch -d' - Deletes a branch 'git checkout <branch-name>' - Switches to (existing branch) <branch-name>. Head points to <branch-name>. VSCode give