<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: TeeTeaTe</title>
    <description>The latest articles on DEV Community by TeeTeaTe (@teeteate).</description>
    <link>https://dev.to/teeteate</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3970476%2F7dc6e641-d88a-47ed-9d00-2e2e3c029a49.png</url>
      <title>DEV Community: TeeTeaTe</title>
      <link>https://dev.to/teeteate</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/teeteate"/>
    <language>en</language>
    <item>
      <title>How I did it: Using Gemini to write copy for my web development projects</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Wed, 05 Aug 2026 11:45:39 +0000</pubDate>
      <link>https://dev.to/teeteate/how-i-did-it-using-gemini-to-write-copy-for-my-web-development-projects-32h5</link>
      <guid>https://dev.to/teeteate/how-i-did-it-using-gemini-to-write-copy-for-my-web-development-projects-32h5</guid>
      <description>&lt;h3&gt;
  
  
  Practical copy makes web projects look better.
&lt;/h3&gt;

&lt;p&gt;Writing copy for web development projects is one of my least favorite things to do. I enjoy writing - about what I'm learning, about what I know, and about myself. I don't enjoy having to write fake content for mockups, and there are only so many &lt;a href="https://lipsum.com" rel="noopener noreferrer"&gt;lorem ipsums&lt;/a&gt; I can stand to look at. &lt;/p&gt;

&lt;p&gt;Copy is a necessary evil as a web developer. If a project is not likely to be seen by many people, I will happily make use of placeholder text. But when I have a larger scale project with multiple pages or parts, I prefer to use actual copy that is related to the project's main purpose.&lt;/p&gt;

&lt;p&gt;Normally I would write copy myself and create content specifically for the mockup. However, writing and editing content for a fake business or project is time-consuming.&lt;/p&gt;

&lt;p&gt;Thank goodness for AI and writing prompts.&lt;/p&gt;

&lt;h3&gt;
  
  
  Getting involved with Google Gemini
&lt;/h3&gt;

&lt;p&gt;I turned to Google Gemini to create simple copy for a web project I'm working on. First I threw the following prompt up to Google Gemini:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Can you come up with the copy for 6 cards for a website that detail their 6 services? The copy should follow the example below and should be realistic for actual financial planning, retirement planning, investing, estate and wealth management, etc.&lt;br&gt;
The cards should be formatted like this:&lt;br&gt;
Card 1: Comprehensive Financial Planning&lt;br&gt;
Card 2: Retirement Income &amp;amp; Distribution Strategy&lt;br&gt;
Card 3: Estate &amp;amp; Wealth Transfer Planning&lt;br&gt;
Card 4: Investment Portfolio Management&lt;br&gt;
Card 5: Proactive Tax Strategy &amp;amp; Optimization&lt;br&gt;
Card 6: Risk Management &amp;amp; Wealth Protection&lt;br&gt;
Each section includes a Card Title, Subtitle/Tagline, Card Description, Key Features List, and a Call to Action button text.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;This prompt told Gemini exactly what I needed for my copy on this web project. But I still needed Gemini to provide complete cards, and to insert the copy into my existing HTML.&lt;/p&gt;

&lt;p&gt;Stay tuned for my next post in this series where I will share more about how I used Gemini to update the copy on my web project.&lt;/p&gt;

&lt;h3&gt;
  
  
  Let's connect!
&lt;/h3&gt;

&lt;p&gt;In the comments below, tell me about how you use AI tools for writing and editing? Share links to anything you've written with AI (blog posts, site content).&lt;/p&gt;

</description>
      <category>ai</category>
      <category>gemini</category>
      <category>googleai</category>
      <category>webdev</category>
    </item>
    <item>
      <title>How to switch between two (or more!) Github accounts in the command line</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Tue, 28 Jul 2026 20:33:12 +0000</pubDate>
      <link>https://dev.to/teeteate/how-to-switch-between-two-or-more-github-accounts-in-the-command-line-eip</link>
      <guid>https://dev.to/teeteate/how-to-switch-between-two-or-more-github-accounts-in-the-command-line-eip</guid>
      <description>&lt;h3&gt;
  
  
  What can happen with two Github accounts?
&lt;/h3&gt;

&lt;p&gt;Recently I needed to switch between my two Github accounts while working on personal projects.&lt;/p&gt;

&lt;p&gt;My primary Github account (which we'll refer to as my "personal Github") is for anything I work on during my personal web development learning. I created a second Github account that I can use for applying to jobs and other opportunities (we can call her my "work Github").&lt;/p&gt;

&lt;p&gt;I committed a project to what I thought was my work Github using the command line before realizing that I had actually made the commits on my personal Github account. The problem? This personal project was incomplete and would reflect poorly on me if a hiring manager saw it. So I had to figure out how to switch between my two Github account when in the CLI on my computer.&lt;/p&gt;

&lt;p&gt;So I went in search of a solution, and one in Github's documentation and in articles written by developers and hobbyists.&lt;/p&gt;

&lt;h3&gt;
  
  
  The command
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="gp"&gt;teeteate:~$&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nb"&gt;alias &lt;/span&gt;&lt;span class="nv"&gt;git_personal&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s1"&gt;'git config --global user.email {personal@mail} &amp;amp;&amp;amp; git config --global user.name {personal_name}'&lt;/span&gt;
&lt;span class="gp"&gt;teeteate:~$&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nb"&gt;alias &lt;/span&gt;&lt;span class="nv"&gt;git_work&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="s1"&gt;'git config --global user.email {work@mail} &amp;amp;&amp;amp; git config --global user.name {work_name}'&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;These two commands allow you to enter your preferred Github account's associated user name and email address in order to switch between the instances that are pushing code from your terminal. Pick either one and edit them between the &lt;em&gt;{}&lt;/em&gt; by adding in your personal or work Github account details and removing the &lt;em&gt;{}&lt;/em&gt; afterward.&lt;/p&gt;

&lt;p&gt;I've been able to easily switch between my two Github accounts this way. I only use two accounts, but you could continue to switch between three or more Github accounts using the commands.&lt;/p&gt;

&lt;h3&gt;
  
  
  Another quirk
&lt;/h3&gt;

&lt;p&gt;One thing I noticed was that my personal Github account username was still somehow listed as a collaborator for a repository that was only on my work Github account.&lt;/p&gt;

&lt;p&gt;To fix this, I blocked my personal Github account username while logged into Github.com with my work Github account, and I blocked my work Github account while logged into Github.com using my personal Github account. This means that each of my accounts will be prevented from pushing my projects to the other account, and there will not be collaborator mixups between the two accounts.&lt;/p&gt;

&lt;h3&gt;
  
  
  What is this useful?
&lt;/h3&gt;

&lt;p&gt;I use Github a few times a week right now while updating my current projects. Next month I will use it even more for pushing personal and portfolio projects. I loved learning about a way to switch between my two accounts easily from the command line. I hope you can use this tip in your own coding journey!&lt;/p&gt;

&lt;h3&gt;
  
  
  Let's connect!
&lt;/h3&gt;

&lt;p&gt;In the comments below, share your Github and one fun tip or trick you learned that is helpful for using Github.&lt;/p&gt;

</description>
      <category>github</category>
      <category>howto</category>
      <category>webdev</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Three Great Tools that help me as a beginner web developer</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Wed, 22 Jul 2026 15:40:26 +0000</pubDate>
      <link>https://dev.to/teeteate/three-great-tools-that-help-me-as-a-beginner-web-developer-2m67</link>
      <guid>https://dev.to/teeteate/three-great-tools-that-help-me-as-a-beginner-web-developer-2m67</guid>
      <description>&lt;h3&gt;
  
  
  Getting started
&lt;/h3&gt;

&lt;p&gt;I &lt;strong&gt;&lt;a href="https://dev.to/teeteate/how-im-doing-it-vibe-coding-my-first-blog-with-free-ai-tools-and-a-static-site-generator-4aph"&gt;recently started creating a blog website&lt;/a&gt;&lt;/strong&gt; using HTML and CSS, and the  &lt;a href="https://deadlogs.shroom.ink/" rel="noopener noreferrer"&gt;Deadlogs blog engine&lt;/a&gt; which is powered by HTML, CSS, and vanilla Javascript.&lt;/p&gt;

&lt;p&gt;This process has been interesting because I'm putting the lessons from &lt;em&gt;&lt;a href="https://www.theodinproject.com/paths/foundations/courses/foundations" rel="noopener noreferrer"&gt;The Odin Project's Foundations course&lt;/a&gt;&lt;/em&gt; into practice while having the simplicity of the blog's template available to me.&lt;/p&gt;

&lt;p&gt;While working on the site, I've also written and published a few &lt;a href="https://dev.to/teeteate"&gt;DEV.TO blog posts&lt;/a&gt; about my experience.&lt;/p&gt;

&lt;p&gt;Something I have found helpful during this process has been finding and using different tools to make writing and posting content easier.&lt;/p&gt;

&lt;p&gt;Read about some of my favorite tools that I use as a beginner web developer. Some of them you may use and some may be new to you:&lt;/p&gt;

&lt;p&gt;First up is &lt;a href="https://markdownlivepreview.dev/tools/markdown-validator" rel="noopener noreferrer"&gt;Markdown Validator&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I use this markdown tool to write and edit Markdown code for my &lt;a href="https://github.com/teeteate" rel="noopener noreferrer"&gt;Github&lt;/a&gt; READMEs and for my DEV.TO posts. Markdown Validator works for me because it is free to use, does not require sign-in, and allows me to immediately preview the work I've written using Markdown. I have WYSIWYG view of my writing without having to install anything. I tell MV how I want my words to look, and it shows me how to properly write Markdown. I also love that previous Markdown remains cached in my browser so I can return to it until my browser's cache is cleared. A README I wrote in MV last week is still available for me to edit or delete.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Next up is &lt;a href="https://obsidian.md/" rel="noopener noreferrer"&gt;Obsidian&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Obsidian is an all-in-one repository for my notes, code snippets, blog posts, drafts of questions for AI engines, and more. Instead of using Google Keep, Notion, Trello, Asana, Monday, Goodreads, Apple Notes, and many more apps for note-taking, list writing, personal development, coding, and planning, I use Obisidian for these things. My vault is scappy right now, but I will refine it for my daily work life as I continue using it&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Rounding out my list is &lt;a href="https://toggl.com/" rel="noopener noreferrer"&gt;Toggl Track&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I was searching for a free tool that would let me track how much time I spent working on each section of The Odin Project (inspired by &lt;a href="https://codebyblazej.com/posts/the-odin-project-experience/" rel="noopener noreferrer"&gt;Code by Blaze J&lt;/a&gt;). Toggl Track works because I can start and stop the timer for any task I'm doing. I currently track how long it takes me to work on job applications daily and how long I work on The Odin Project courses. Toggl Track is a game changer for time-blocking and lessening distractions.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;These three tools help me daily with managing my time and projects as a beginner web developer. I enjoy using them during dedicated learning blogs, while applying for jobs, and during writing sessions. As I learn more and work on new projects, I will surely add more great tools to my toolbox.&lt;/p&gt;

&lt;h3&gt;
  
  
  Let's connect!
&lt;/h3&gt;

&lt;p&gt;What tools do love for your professional work, while studying, or  for your personal projects? Comment below with three tools that make work easier for you.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Supporting Fellow Engineers: The Paiges Book App</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Tue, 21 Jul 2026 15:47:36 +0000</pubDate>
      <link>https://dev.to/teeteate/supporting-fellow-engineers-the-paiges-book-app-4enl</link>
      <guid>https://dev.to/teeteate/supporting-fellow-engineers-the-paiges-book-app-4enl</guid>
      <description>&lt;p&gt;&lt;em&gt;The Paiges Book App - How I use it, what I like, and why the app works.&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Book lovers to the front
&lt;/h3&gt;

&lt;p&gt;I have loved reading for as I long as I can remember. &lt;/p&gt;

&lt;p&gt;I can still remember how much I enjoyed reading the Bernstein Bears and Babysitter's Club books when I was a child. In elementary school, I remember having to write book reports regularly as a way to practice my writing skills. In my later school years, book reports were replaced with essays and papers. &lt;/p&gt;

&lt;h3&gt;
  
  
  Discovering reading apps
&lt;/h3&gt;

&lt;p&gt;I didn't continue logging my reading progress again until college - thanks to an app called &lt;a href="https://en.wikipedia.org/wiki/Shelfari" rel="noopener noreferrer"&gt;RIP Shelfari&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Shelfari was a social media site built for book lovers. You could catalog your books, connect with friends on the app, and categorize your books onto different shelves. I remember liking the user experience enough. &lt;/p&gt;

&lt;p&gt;At some time after joining Shelfari, I heard about a &lt;em&gt;new&lt;/em&gt; bookish app called Goodreads. At the time, Goodreads was led by a small team and offered better UI/UX along with the ability to catalog even more books using their search functionality.&lt;/p&gt;

&lt;p&gt;I joined Goodreads, and it's been the one book app that I have stuck with since the aughts.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fam588yw3p7cq4lg1l6br.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fam588yw3p7cq4lg1l6br.png" alt="Shelfari and Goodreads were two of the earliest social apps for book lovers" width="800" height="800"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Over the years, I &lt;em&gt;have&lt;/em&gt; tried some of the new, shiny reading apps that I have come out:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;StoryGraph&lt;/strong&gt; - I love the way StoryGraph shares data with users. You not only see how many books you have read, but the app show you your typical reading pace, and helps you plan to reach your yearly reading goals.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pocket&lt;/strong&gt; - My foray into this app was brief because I was terrible with keeping up with it.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  My favorite non-reading reading app
&lt;/h3&gt;

&lt;p&gt;I do most of my reading tracking and sharing about books on Goodreads.  But Youtube was my favorite non-reading reading app for a long time. The "Booktube" community shaped an online space  where I was able to learn about new books and watch book reviews from fellow book lovers (called 'Booktubers') who filmed Youtube videos. I keep a long 'to be read' (TBR) to this day thanks in part to Booktube.&lt;/p&gt;

&lt;h3&gt;
  
  
  My personal reading pandemic
&lt;/h3&gt;

&lt;p&gt;My reading habit slowed down a lot during the onset of the 2020 pandemic. Although the pandemic offered a break from normal day-to-day activities, dealing with social distancing and wearing personal protective equipment (PPE) created new distractions. I took lots of walk, binge watched some TV shows, and worked. But I did not read as much as I was used to.&lt;/p&gt;

&lt;p&gt;Tiktok took off during the pandemic since people all over the globe were forced to stay home. I avoided Tiktok as best as I could... until 2024&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6hajlk05glktp3v694k9.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6hajlk05glktp3v694k9.png" alt="Booktok is the community for book lovers on Tiktok" width="799" height="436"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  How I Booktok
&lt;/h3&gt;

&lt;p&gt;Eventually, I discovered on TikTok that the BookTube community had migrated to the platform, giving rise to BookTok. Booktok is a similar community for book lovers - where you can learn about books, watch book reviews, and connect with other community members - all through bite sized short videos. Booktok feels more far-reaching since Tiktok lets users from around the world jump into each other's algorithms via their For You page (FYP). I follow Booktokers who read discuss books about Black and urban fiction, romance, history, historical fiction, contemporary fiction, and history and culture nonfiction. I've even dipped my toe into thrillers and sci-fi and follow some of the Booktokers who enjoy those genres.&lt;/p&gt;

&lt;h3&gt;
  
  
  Introducing Paiges
&lt;/h3&gt;

&lt;p&gt;Last week, I caught a video on my TikTok FYP that featured a Booktoker talking about a new app. The app's UI looked customizable and pretty in pink. I put it in the back of my mind because I had other work to do throughout the week.&lt;/p&gt;

&lt;p&gt;This week I finally downloaded &lt;a href="https://paiges.app/" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt; to my phone. The app is currently available for iOS and will be available for Android soon. &lt;a href="https://paiges.app/" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt; lets users to customize their reading profile page with a banner of their choice, and I was able to register an account that uses only my first name as my username. I name is not super common but is also not very uncommon. But I rarely am early enough in a userbase to grab it as a username. Score!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9fu91oj2qpp96b3ei9us.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9fu91oj2qpp96b3ei9us.png" alt="Introducing the Paiges book app, solo developed by a first-time mobile engineer" width="799" height="436"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h4&gt;
  
  
  A few things I love about the Paiges app:
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;The ability to customize parts of the user profile - I love a hot pink accent anywhere. So being able to add banners and select pink for app accents is a plus.&lt;/li&gt;
&lt;li&gt;The ability to search for and add friends by username or email address - You can add friends and build your community within the app&lt;/li&gt;
&lt;li&gt;The ability to pull in book information from Google Books - Google Books has digitized and indexed over &lt;strong&gt;40 MILLION&lt;/strong&gt; books. Most users will find the majority of their books are easily searchable and can be added to their reading log in a breeze. I love that &lt;a href="https://paiges.app/" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt; does not rely on Amazon for their book database.&lt;/li&gt;
&lt;li&gt;A built-in reading journal - As someone who has struggled to consistently journal and stick to one reading journal platform (I've tried everything - a dedicated reading journal, random notebooks, journling on sticky notes, keeping a journal on my existing blog - everything!), this feature is a game changer. Paiges lets you log your books and has a place to share about your experience with the text.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://paiges.app/" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt; feels more like a friendly social media community rather than something massive like Goodreads or Tiktok. Because the app is still in its early stages, it still feels like a tight-knit community of your cool friends who are in the know. IYKYK. &lt;/li&gt;
&lt;/ul&gt;

&lt;h4&gt;
  
  
  Some other fun things about the Paiges app:
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;The app is created by &lt;a href="https://www.threads.com/@hertechlegacy" rel="noopener noreferrer"&gt;Jeniah Richbow&lt;/a&gt;, a young Black woman computer scientist and first-time mobile developer.&lt;/li&gt;
&lt;li&gt;Because the developer is solo developing the app, you can see progress and changes almost in real time. &lt;/li&gt;
&lt;li&gt;The developer is open to user feedback &lt;a href="https://www.threads.com/@hertechlegacy" rel="noopener noreferrer"&gt;(per her Threads account)&lt;/a&gt;, and she makes app improvements per user's suggestions.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Overall I really enjoying using Paiges. But there's always room for improvement especially on a new project that has the potential to be used by millions of people. &lt;/p&gt;

&lt;h4&gt;
  
  
  Some areas for improvement on the Paiges app:
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;The experience when adding books by indie authors is slower than I prefer. I'm hoping user input will inrease the indie books that are available in the platform.&lt;/li&gt;
&lt;li&gt;Adding book covers is painful - You have to find the book cove and upload the image yourself. A way to associate a book cover image with its Google Books entry somehow would be clutch!&lt;/li&gt;
&lt;li&gt;Adding friends - Right now, I have to know someone's username or search for their approximate username. A member's directory on the app would be helpful. I would prefer not to have the "Find contacts by their phone number/existing social media accounts" enabled but I know that's probably coming soon.&lt;/li&gt;
&lt;li&gt;The current app feels better suited for an iPad or another tablet. I used my old trusty iPhone to download and use the app. It works fine. But the app just feels like its meant for tablet users in its current iteration. I think finding a way to make it faster and give the UI a snappy feel would improve the usability on phones.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I'm enjoying the Paiges app, and I will continue adding books and tracking my reading there. Fellow readers, meet me over on &lt;a href="https://apps.apple.com/us/app/paiges-the-reading-journal/id6764674358" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You can add me on Paiges(&lt;a href="https://apps.apple.com/us/app/paiges-the-reading-journal/id6764674358" rel="noopener noreferrer"&gt;https://apps.apple.com/us/app/paiges-the-reading-journal/id6764674358&lt;/a&gt;) now. My username is &lt;u&gt;teeteate&lt;/u&gt;.
Join Paiges on the &lt;a href="https://apps.apple.com/us/app/paiges-the-reading-journal/id6764674358" rel="noopener noreferrer"&gt;Apple App store&lt;/a&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Make sure to show the &lt;strong&gt;&lt;a href="https://apps.apple.com/us/app/paiges-the-reading-journal/id6764674358" rel="noopener noreferrer"&gt;Paiges&lt;/a&gt; app developer Jeniah Richbow&lt;/strong&gt; some love on her business page - &lt;a href="https://www.hertechlegacy.com/" rel="noopener noreferrer"&gt;Her Tech Legacy&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Let's connect!
&lt;/h3&gt;

&lt;p&gt;Add me on Paiges. I'll add you back. Comment below if you use Paiges and share your Paiges username.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>paigesapp</category>
    </item>
    <item>
      <title>How I'm Doing It: Vibe coding my first blog with free AI tools and Deadlogs blog engine</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Tue, 21 Jul 2026 02:11:17 +0000</pubDate>
      <link>https://dev.to/teeteate/how-im-doing-it-vibe-coding-my-first-blog-with-free-ai-tools-and-a-static-site-generator-4aph</link>
      <guid>https://dev.to/teeteate/how-im-doing-it-vibe-coding-my-first-blog-with-free-ai-tools-and-a-static-site-generator-4aph</guid>
      <description>&lt;h3&gt;
  
  
  Why Blogging?
&lt;/h3&gt;

&lt;p&gt;I've always loved &lt;del&gt;blogging&lt;/del&gt; writing. I believe in the ✨ magical✨ power of written expression. Over the years, I've enjoyed handwriting personal journal entries and making lists of all kinds. Writing has helped me with planning my days and setting goals, and I plan to delve back into academic writing sometime this year. Blogging has always been a logical part of expressing myself &lt;em&gt;online&lt;/em&gt;. I've used blogging platforms - Wordpress, Blogger, and even Livejournal way before that. I've missed the community of online blogging social media sites. Dev.To allows me to write in a community of writers and developers. But I wanted to create a place online that was just for me to write, rant, and create an archived of a life well-lived.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Issue
&lt;/h3&gt;

&lt;p&gt;As a beginner web developer, I have been able to admire personal websites built with static site generators like &lt;a href="https://www.11ty.dev/" rel="noopener noreferrer"&gt;11ty&lt;/a&gt; and &lt;a href="https://astro.build/" rel="noopener noreferrer"&gt;Astro&lt;/a&gt;. Since I am still not finished with my introductory HTML and CSS learning, I didn't want to jump into those Javascript-based tools yet. I needed a way to build my blog using a blog engine that was much more beginner-friendly.&lt;/p&gt;

&lt;h3&gt;
  
  
  Finding a Solution
&lt;/h3&gt;

&lt;p&gt;While scrolling through some &lt;a href="https://teeteate.neocities.org" rel="noopener noreferrer"&gt;Neocities&lt;/a&gt; pages one day, I found the &lt;a href="https://deadlogs.shroom.ink/about.html" rel="noopener noreferrer"&gt;Deadlogs site generator&lt;/a&gt;. It helps users generate static sites using HTML and CSS with Javascript that helps the pages and navigation menus all work together. I was stoked to find a template for a blog that seemed easily editable by a newbie.&lt;/p&gt;

&lt;h3&gt;
  
  
  About Deadlogs
&lt;/h3&gt;

&lt;p&gt;As I mentioned in a &lt;strong&gt;&lt;a href="https://dev.to/teeteate/colors-fonts-and-chaos-css-blogging-5gfb"&gt;previous post&lt;/a&gt;&lt;/strong&gt;, the Deadlogs generator comes with a way to create a static blog page that includes a home page, an archives section, and a way to move between blog entries.&lt;/p&gt;

&lt;p&gt;I found a template I like - &lt;a href="https://deadlogs.shroom.ink/themes/wheat/" rel="noopener noreferrer"&gt;Wheat&lt;/a&gt; - and got to work!&lt;/p&gt;

&lt;p&gt;The default file structure of this template looks something like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;wheat
├── assets
│   ├── images
│   │   ├── favicon.ico # Site icon
│   │   └── default.css # Primary stylesheet
│   ├── style
│   │   └── main.css # Secondary stylesheet
│   └── scripts
│       ├── console.js # Javascript for the console
│       ├── posts.js # Javascript for posts
│       └── deadlogs.js # Javascript for site structure and navigation
├── entry.html # Template for individual log entries / posts
└── index.html # Main homepage
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;I knew that I wanted to include a few pages that were not included in the Wheat Template.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;/Now&lt;/em&gt;&lt;/strong&gt; would be a Now page that tells users what I'm doing right now and includes a status.cafe embedded page or link.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;/Garden&lt;/em&gt;&lt;/strong&gt; would be my fun online place to share things I collect and enjoy including sub-pages for /Reading, /Learning, and /Site Stuff&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;u&gt;Here's where vibecoding comes in&lt;/u&gt;&lt;/strong&gt;. I wanted to use an AI tool that was FREE and did not require an additional account or email address to register. Since I already use Google's services for my 50-11 email addresses, I decided to use Google's Gemini AI.&lt;/p&gt;

&lt;p&gt;I only wanted Gemini to update my navigation menus, and my templates for each page's index.html page&lt;/p&gt;

&lt;p&gt;Over the past few weeks with lots of breaks for water and coffee in between, I edited the Deadlogs template to create a blog site that I'm happy with. Gemini came in clutch. I used it to update my navigation menus, fix some of my file structure issues, update and change CSS to my liking. Overall, she is THAT GIRL for launching a site from zero to blog quickly.&lt;/p&gt;

&lt;h3&gt;
  
  
  Site Analytics
&lt;/h3&gt;

&lt;p&gt;I recently launched some small personal projects online that I will write about soon. With one of the projects, I was able to use a free analytics tool that is built into another free site hosting tool. This analytics tools lets me easily see my page views, how visitors get to my site, and from where my site visitors are logging in. My visitors are only from the United States and Poland (!) so far. &lt;strong&gt;&lt;em&gt;Co słychać u moich Polskich przyjaciół!&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;This helpful tool offers everything I need for now. And for free! But I wanted something a bit easier to use with an admin portal that where I could see analytics for multiple sites at once. I also needed this new analytics tool to work on Github Pages sites. So I decided to go with another great free analytics tool that is standalone and can be used for free on many sites. Google Analytics is it!&lt;/p&gt;

&lt;p&gt;I added code to my site for Google Analytics and used Gemini to fix some of the outstanding issues.&lt;/p&gt;

&lt;h3&gt;
  
  
  Fun stuff
&lt;/h3&gt;

&lt;p&gt;I registered on &lt;a href="https://status.cafe" rel="noopener noreferrer"&gt;status.cafe&lt;/a&gt;. Still waiting on my account activation. My status profile will eventually go on my now page.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Future of this blog
&lt;/h3&gt;

&lt;p&gt;I'll keep my Deadlogs blog around for a while - probably at least until I finish up The Odin Project's Foundations course and more Responsive Web Design learning. The template is simple enough to update with new blog posts a few times per week.&lt;/p&gt;

&lt;h3&gt;
  
  
  Check out my blog
&lt;/h3&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;&lt;a href="https://teeteate.github.io/blog/" rel="noopener noreferrer"&gt;teeteate.github.io/blog/&lt;/a&gt;&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;My site is ready for launch (while some things are still a WIP). I have to fix the blog sections over the next few days. But I wanted to get something up tonight. I hope you'll take a look! All of my site tools used can be found in the sources.txt file which is mentioned in my first blog post.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>vibecoding</category>
    </item>
    <item>
      <title>Vibe coding while learning</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Mon, 20 Jul 2026 15:13:01 +0000</pubDate>
      <link>https://dev.to/teeteate/vibe-coding-while-learning-2991</link>
      <guid>https://dev.to/teeteate/vibe-coding-while-learning-2991</guid>
      <description>&lt;p&gt;I practiced vibe coding yesterday, and have implemented vibe coding into some of my works in progress.&lt;/p&gt;

&lt;h4&gt;
  
  
  What is vibe coding?
&lt;/h4&gt;

&lt;p&gt;Vibe coding is "a software development workflow where you describe the goal of your app in plain language, and let artificial intelligence handle the technical implementation", and the term was coined by AI researcher Andrej Karpathy in 2025. &lt;/p&gt;

&lt;p&gt;You can use vibe coding to create entire websites and apps, or you can use vibe coding to improve certain parts of your product's architecture.&lt;/p&gt;

&lt;h4&gt;
  
  
  Should beginner learn to vibe code?
&lt;/h4&gt;

&lt;p&gt;Vibe coding as a beginner is not recommended by The Odin Project and other coding courses. But it is helpful when talking through technical problems, getting help with solutions in real time, and being able to reconfigure your projects or improve how you ask questions.&lt;/p&gt;

&lt;h4&gt;
  
  
  What are your thoughts?
&lt;/h4&gt;

&lt;p&gt;Do you vibe code? How do you use AI to help you with building projects?&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>vibecoding</category>
      <category>ai</category>
    </item>
    <item>
      <title>Colors, Fonts, and Chaos: CSS Blogging</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Wed, 15 Jul 2026 01:41:54 +0000</pubDate>
      <link>https://dev.to/teeteate/colors-fonts-and-chaos-css-blogging-5gfb</link>
      <guid>https://dev.to/teeteate/colors-fonts-and-chaos-css-blogging-5gfb</guid>
      <description>&lt;h3&gt;
  
  
  Getting started
&lt;/h3&gt;

&lt;p&gt;This weekend I started working on setting up a blog website using the site generator called &lt;a href="https://deadlogs.shroom.ink/" rel="noopener noreferrer"&gt;Deadlogs&lt;/a&gt;. I chose this site generator since it is based on HTML and CSS. There are Javascript elements used for the navigation and pagination, but overall it allows me to make and update a static site without needing much Javascript.&lt;/p&gt;

&lt;p&gt;I chose the &lt;a href="https://deadlogs.shroom.ink/themes/wheat/" rel="noopener noreferrer"&gt;Wheat&lt;/a&gt; template because I liked the cool floral geometric patterned background image, the transparent gray border for posts, and the simple fonts used.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Frmbme3dyc0mzyyd0hh8b.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Frmbme3dyc0mzyyd0hh8b.png" alt="The original Wheat Deadlogs template" width="800" height="637"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Downloading the template package from Github was simple.&lt;/p&gt;

&lt;p&gt;Then I edited a pink and gray patterned background online. I am obsessed at the moment with the Inter font from Google Fonts. It looks smooth and makes my writing feel very organized. I chose Inter for the main site text.&lt;/p&gt;

&lt;h3&gt;
  
  
  Choosing Fonts
&lt;/h3&gt;

&lt;p&gt;For my pink header, I used Momo Signature. It's a cursive font that reminds me of Monotype Corsiva, a cursive font that was popular &lt;a href="https://learn.microsoft.com/en-us/typography/font-list/monotype-corsiva" rel="noopener noreferrer"&gt;back in the day&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqxzb918rjkex395r2frr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqxzb918rjkex395r2frr.png" alt=" " width="799" height="556"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Selecting Colors
&lt;/h3&gt;

&lt;p&gt;Pink is one of my favorite colors. So I used for #fb52a7 for accent color (links), hot pink for titles and headers, and #012410 a dark green for my main text color. And I kept the original template's gray color for the background on the main content area.&lt;/p&gt;

&lt;h3&gt;
  
  
  What's Next?
&lt;/h3&gt;

&lt;p&gt;Next up, I plan to add content for my pages. I'll share an update soon with those next steps!&lt;/p&gt;

&lt;h3&gt;
  
  
  Talk to me
&lt;/h3&gt;

&lt;p&gt;Do you use static site generators? What is your favorite static site generator? &lt;strong&gt;Share your sites in the comments.&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>css</category>
      <category>html</category>
      <category>fonts</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Practicing CSS with Neocities</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Fri, 10 Jul 2026 19:48:27 +0000</pubDate>
      <link>https://dev.to/teeteate/practicing-css-with-neocities-2mke</link>
      <guid>https://dev.to/teeteate/practicing-css-with-neocities-2mke</guid>
      <description>&lt;p&gt;I built a static webpage for my Neocities site using HTML, CSS, and a couple lines of Javascript to force myself to understand CSS and the box model.&lt;/p&gt;

&lt;h2&gt;
  
  
  The issue
&lt;/h2&gt;

&lt;p&gt;I started the The Box model lesson around June 24, 2026. The lesson is short but has multiple resources for learning about and practicing the box model. For some reason, these lessons are not sticking. I read and watched each resource twice. After these reviews, I worked on a &lt;a href="https://teeteate.github.io/rothko/" rel="noopener noreferrer"&gt;Rothko painting&lt;/a&gt;, did a codealong to create a &lt;a href="https://teeteate.github.io/html-css-portfolio/" rel="noopener noreferrer"&gt;HTML/CSS portfolio&lt;/a&gt;, and began working on a recreating the iconic nutrition facts using HTML and CSS. Nothing is sticking because I cannot layout projects using the box model without continuing to refer to my notes or online resources.&lt;/p&gt;

&lt;h2&gt;
  
  
  Neocities
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://neocities.org" rel="noopener noreferrer"&gt;Neocities&lt;/a&gt; is a website that allows users to create personal webpages that have the look and feel of the "old web". People get really creative and make beautiful looking static websites using pixelated graphics, cute cursors, and more.&lt;/p&gt;

&lt;p&gt;I created my account. This is what a Neocities page looks like before a user begins designing their own page.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjj2zgreiq82cgkn9vuov.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjj2zgreiq82cgkn9vuov.png" alt="TeeTeaTe Neocities page before redesign" width="800" height="564"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I decided to create a simple webpage that would allow me to practice CSS - the box model, positioning, and basic HTML as well - forms, semantic HTML tags, and more.&lt;/p&gt;

&lt;p&gt;My site is structured with: a root directory, three additional directories, seven additional pages. I used one form and a bit of Javascript (from Google Gemini AI) on my contact page.&lt;/p&gt;

&lt;h3&gt;
  
  
  Pushing to Github
&lt;/h3&gt;

&lt;p&gt;I'm pretty comfortable pushing to Github. I created my repository (named neocities) first. Then I pushed my root directory to that folder.&lt;/p&gt;

&lt;h3&gt;
  
  
  Deploying from Github to Neocities
&lt;/h3&gt;

&lt;p&gt;Deploying my site from Github to Neocities was super confusing, so I'll dedicate time over the next week learning more about &lt;code&gt;Devops&lt;/code&gt;, &lt;code&gt;CI/CD&lt;/code&gt;, and working with &lt;code&gt;Github Actions&lt;/code&gt;. &lt;a href="https://scumsuck.com/resources/deployneocities/" rel="noopener noreferrer"&gt;This tutorial&lt;/a&gt; was easy to understand, and helped make the process simpler.&lt;/p&gt;

&lt;p&gt;As I continue through the Foundations course and eventually tackle the Fullstack Javascript learning path by The Odin Project, my Neocities page will be my fun, carefree home online where I can show what I've learned.&lt;/p&gt;

&lt;h2&gt;
  
  
  What's next
&lt;/h2&gt;

&lt;p&gt;My plan is to redesign my Neocities page monthly. No themes right now, so I'll redesign based on whatever inspires me at the moment. I want to add a few things so I'll list some of them:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;counters for page views&lt;/li&gt;
&lt;li&gt;a guestbook&lt;/li&gt;
&lt;li&gt;responsiveness so mobile viewers can actually enjoy my page&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Eventually I also want to design some free themes for Neocities users. Learning more about CSS is making me want to create and design pretty things on the web!&lt;/p&gt;

&lt;h2&gt;
  
  
  Come say hello!
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;strong&gt;Check out my Neocities page at &lt;a href="https://teeteate.neocities.org/" rel="noopener noreferrer"&gt;teeteate.neocities.org&lt;/a&gt;&lt;/strong&gt;
&lt;/h4&gt;

&lt;p&gt;Please follow me there. I'm excited to meet you, and to share my learning journey over there in real time :)&lt;/p&gt;

&lt;p&gt;And while you're at it, leave a comment and follow me on DEV.TO. Let's keep in touch!&lt;/p&gt;

&lt;p&gt;Article credits:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.w3schools.com/tools/tool_image_border.php" rel="noopener noreferrer"&gt;W3schools Add Border to Image&lt;/a&gt;: for quickly adding borders to my screenshots&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.freecodecamp.org/learn/responsive-web-design-v9/workshop-rothko-painting/" rel="noopener noreferrer"&gt;FreeCodeCamp&lt;/a&gt;: I used their assignment to practice the CSS box model by recreating a Rothko painting&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://scumsuck.com" rel="noopener noreferrer"&gt;Temporal&lt;/a&gt;: for his excellent &lt;a href="https://scumsuck.com/resources/deployneocities/" rel="noopener noreferrer"&gt;Deploying to Neocities guide&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>css</category>
      <category>beginners</category>
      <category>webdev</category>
      <category>neocities</category>
    </item>
    <item>
      <title>How I Spent The Past Few Weeks as a Beginner Web Developer</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Thu, 09 Jul 2026 17:57:04 +0000</pubDate>
      <link>https://dev.to/teeteate/how-i-spent-past-few-weeks-as-a-beginner-web-developer-2l75</link>
      <guid>https://dev.to/teeteate/how-i-spent-past-few-weeks-as-a-beginner-web-developer-2l75</guid>
      <description>&lt;p&gt;The past few weeks have been busy with learning. I started by working on a basic linktree style link site. My goal was to create my own version of &lt;a href="https://www.w3schools.com/howto/howto_website_create_linktree.asp" rel="noopener noreferrer"&gt;this one&lt;/a&gt; from w3schools:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F4arabdu90os5udxtd08b.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F4arabdu90os5udxtd08b.png" alt="w3schools link site example - Courtesy of w3schools" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Issue
&lt;/h2&gt;

&lt;p&gt;I created my first version with the CSS inside &lt;code&gt;&amp;lt;style&amp;gt;&lt;/code&gt;&lt;code&gt;&amp;lt;/style&amp;gt;&lt;/code&gt; tags on the index.html page. This worked perfectly. Then, I moved the css into it's own file called styles.css in the root directory. Unfortunately, this broke the link between my css file and the html site somehow.&lt;/p&gt;

&lt;p&gt;Stuck, I tried creating a folder called mycss and putting the css there. This didn't do it either. I cleared cache from devtools using `Cmd + Option + I. Nothing. So I did what any self respecting beginner would do, and joined a Discord server for learning HTML.&lt;/p&gt;

&lt;p&gt;An engineer named &lt;strong&gt;Tokdev&lt;/strong&gt; helped me out, and I continued to work on my file setup. Eventually, my site went from this:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fwqf0uddygva9k1seq8bb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fwqf0uddygva9k1seq8bb.png" alt="Site with issues linking the CSS" width="800" height="2210"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;to this:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fk51xzv7gtj92kzf3t1gr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fk51xzv7gtj92kzf3t1gr.png" alt="Fixed the CSS link issue!" width="800" height="2210"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Resolution
&lt;/h2&gt;

&lt;p&gt;I worked a little more on aligning everything, and you can see the completed link site &lt;a href="https://teeteate.github.io/html-linksite/" rel="noopener noreferrer"&gt;here&lt;/a&gt;. The site is HTML and some CSS only since we had only covered HTML in The Odin Project so far.&lt;/p&gt;

&lt;h3&gt;
  
  
  🛠️ What I Did In The Past Few Weeks
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Joined the &lt;a href="https://discord.gg/YPetRmdS" rel="noopener noreferrer"&gt;Learn HTML&lt;/a&gt; discord&lt;/li&gt;
&lt;li&gt; Reviewed links and paths using &lt;a href="https://www.youtube.com/watch?v=HyCjbxRm08k" rel="noopener noreferrer"&gt;Steve Griffin's video&lt;/a&gt; and &lt;a href="https://codepen.io/editor/tok124/pen/019dd198-0cf7-7755-ae50-24be56f7339c" rel="noopener noreferrer"&gt;this game&lt;/a&gt; - Thanks Tokdev!&lt;/li&gt;
&lt;li&gt;Completed The Odin Projects HTML Foundations course, and successfully completed all projects! You can view my final project, a HTML recipes page called Odin-Recipes &lt;strong&gt;&lt;a href="https://teeteate.github.io/odin-recipes/" rel="noopener noreferrer"&gt;here&lt;/a&gt;&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;Begin TOP's CSS Foundations course, and practice CSS by creating a few projects.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  🧠 What I Learned In The Past Few Weeks
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;How to create a gradient using CSS. I want to learn more about this, but it was fun setting up a basic gradient for my link site.&lt;/li&gt;
&lt;li&gt;Some semantic HTML tags like &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;and &lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;How to push my project to Github repository.&lt;/li&gt;
&lt;li&gt;How to write commit messages in Github so I understand changes made to my code.&lt;/li&gt;
&lt;li&gt;How to create a live demo of my project using &lt;strong&gt;&lt;a href="https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-github-pages-site" rel="noopener noreferrer"&gt;Github Pages&lt;/a&gt;&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;How to screenshot an entire site without losing context or readability Thanks to &lt;a href="https://www.reddit.com/r/chrome/comments/usuzcv/how_can_i_screenshot_an_entire_website/" rel="noopener noreferrer"&gt;Reddit&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt;How to mimic this free &lt;a href="https://www.magnific.com/free-vector/watercolor-pink-green-background_40125052.htm#fromView=image_search_similar&amp;amp;page=1&amp;amp;position=0&amp;amp;uuid=972c84e1-121d-49ec-80ab-c830cd10418e&amp;amp;query=Pink+green+background" rel="noopener noreferrer"&gt;Magnific image&lt;/a&gt; by creating a &lt;a href="https://css-tricks.com/a-complete-guide-to-css-gradients/#h-radial-gradients" rel="noopener noreferrer"&gt;radial gradient&lt;/a&gt; background image.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  📆 Upcoming Plans
&lt;/h3&gt;

&lt;p&gt;Next week, I will work some more on understanding CSS and positioning using the box model, and then begin working through The Odin Project's Flexbox unit. I hope to finish their Javascript Basics course by the end of this month.&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>theodinproject</category>
    </item>
    <item>
      <title>How I Chose My Web Development Path as a Beginner</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Sun, 21 Jun 2026 15:14:23 +0000</pubDate>
      <link>https://dev.to/teeteate/how-i-chose-my-web-development-path-as-a-beginner-kdo</link>
      <guid>https://dev.to/teeteate/how-i-chose-my-web-development-path-as-a-beginner-kdo</guid>
      <description>&lt;p&gt;Choosing a learning path is one of the most critical decisions you make as a beginner. When I set out to learn web development, I knew exactly what I needed: resources that were thorough, accessible 24/7, and completely free—both online and in print.&lt;/p&gt;

&lt;p&gt;Before settling on my 2026 learning path, I experimented with a few popular options. Here is a look at what I tried, why they didn’t quite stick, and where I ultimately landed.&lt;/p&gt;

&lt;h2&gt;
  
  
  What Didn’t Work for Me
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Scrimba&lt;/strong&gt;&lt;br&gt;
Scrimba offers highly interactive introductory courses in web development. However, I realized a bit too late that the platform isn't entirely free; a paywall kicks in shortly after you begin the core HTML and CSS sections. Because I was looking for fully open resources, I had to move on.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Frontend Mentor&lt;/strong&gt;&lt;br&gt;
Frontend Mentor is an excellent platform for practicing UI design, but it operates on a freemium model. While the basic learning paths are free, accessing project solutions, starter files, and advanced challenges requires a paid upgrade.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;100Devs&lt;/strong&gt;&lt;br&gt;
100Devs is a free, self-paced, community-taught bootcamp led by Leon Noel. Originally broadcast live on Twitch, the full 30-week course repository is now available on YouTube and communitytaught.org.&lt;/p&gt;

&lt;p&gt;I actually joined the inaugural cohort in 2020 and attempted subsequent restarts. Leon is an engaging instructor, but the live-stream format presents some hurdles for self-paced learners. The videos are several hours long and include significant time spent interacting with the live chat, managing stream tangents, and breaking away from the core curriculum. Ultimately, the pacing made it difficult for me to stay focused and build momentum.&lt;/p&gt;

&lt;p&gt;(Note: I also found myself misaligned with some of the community’s culture and leadership choices over time, which made it easier to look for a fresh start elsewhere.)&lt;/p&gt;

&lt;h2&gt;
  
  
  What did I choose?
&lt;/h2&gt;

&lt;p&gt;Ultimately, I chose The Odin Project (TOP) as my primary framework, and I couldn't be happier with the decision.&lt;/p&gt;

&lt;p&gt;&lt;u&gt;The Odin Project checks every single box for me&lt;/u&gt;:&lt;/p&gt;

&lt;p&gt;100% Free: No hidden paywalls or premium tiers.&lt;/p&gt;

&lt;p&gt;Thorough &amp;amp; Deep: It provides an incredible foundation, guiding you through the Command Line, Git, GitHub, HTML, CSS, and JavaScript.&lt;/p&gt;

&lt;p&gt;Project-Based: You build real projects from scratch, including extra credit assignments that push your limits.&lt;/p&gt;

&lt;p&gt;Flexible: It’s fully online and accessible 24/7, allowing me to learn at my own pace.&lt;/p&gt;

&lt;h2&gt;
  
  
  Supplementing the Journey
&lt;/h2&gt;

&lt;p&gt;To round out my education, I am supplementing TOP’s curriculum with their curated external links and a personal goal: reading one non-fiction and/or web development book per month.&lt;/p&gt;

&lt;p&gt;Finding the right path is all about trial and error. It takes time to discover what aligns with your learning style, but finding the right fit makes all the difference. I’ll dive into the first book on my reading list in my next post—stay tuned!&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>productivity</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>Here to Learn</title>
      <dc:creator>TeeTeaTe</dc:creator>
      <pubDate>Fri, 05 Jun 2026 22:44:33 +0000</pubDate>
      <link>https://dev.to/teeteate/here-to-learn-242j</link>
      <guid>https://dev.to/teeteate/here-to-learn-242j</guid>
      <description>&lt;p&gt;I'm Tee (&lt;a class="mentioned-user" href="https://dev.to/teeteate"&gt;@teeteate&lt;/a&gt;), and I'm here to learn. Dev.to will be my space to document my learning journey in public. I have spent time being afraid to learn, fail, and grow especially in view of other people. I no longer want to remain stagnant and in hiding.&lt;/p&gt;

&lt;p&gt;My goals are to:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Complete a data analytics course&lt;/strong&gt;:&lt;br&gt;
This learning path will focus on Microsoft Excel, SQL, and Python. I may also include Power BI. My goal for learning data analytics is to gain an understanding of using and managing data along with backend web development.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Complete a full-stack web development learning path&lt;/strong&gt;:&lt;br&gt;
This learning path is one that I have started and quit more times than I can count. I want to learn full-stack web development well enough to build a portfolio of projects. I'm starting with HTML and CSS, and will continue to build from there using the MERN stack - MongoDB (NoSQL database), Express.js (backend framework), React (frontend library), and Node.js (runtime environment). &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Learn computer science and web development fundamentals&lt;/strong&gt;: The plan is to do some learning on web fundamentals using free and low-cost resources online.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Combine my love of art and color to learn some design and UX/UI basics&lt;/strong&gt;: I hope to build beautiful projects, and want to use UX and UI fundamentals to help me. I'm not sure yet how I will do this.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I hope the DEV.to community will join me on my learning journey! Let's connect here - follow me, leave a comment, and like and share this post! Excited to get started and learn with you!&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>codenewbie</category>
      <category>learning</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
