<?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: codingJourneyFromUnemployment</title>
    <description>The latest articles on DEV Community by codingJourneyFromUnemployment (@codingjourneyfromunemployment).</description>
    <link>https://dev.to/codingjourneyfromunemployment</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.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1116231%2F906866c1-5d4d-464a-a9d3-caa908031076.png</url>
      <title>DEV Community: codingJourneyFromUnemployment</title>
      <link>https://dev.to/codingjourneyfromunemployment</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/codingjourneyfromunemployment"/>
    <language>en</language>
    <item>
      <title>Which Writing Platform Really Works for newbie tech writers in 2023 and Why</title>
      <dc:creator>codingJourneyFromUnemployment</dc:creator>
      <pubDate>Mon, 14 Aug 2023 01:30:04 +0000</pubDate>
      <link>https://dev.to/codingjourneyfromunemployment/which-writing-platform-really-works-for-newbie-tech-writers-in-2023-and-why-4k0k</link>
      <guid>https://dev.to/codingjourneyfromunemployment/which-writing-platform-really-works-for-newbie-tech-writers-in-2023-and-why-4k0k</guid>
      <description>&lt;p&gt;As of today, it seems that the major content production spaces on the internet have been dominated by videos, with writing often perceived as an outdated skill. However, many content creators fail to recognize that content forms that use text and images as mediums are naturally more suitable for conveying relatively complex content and thoughts. The medium of the content itself also serves as a form of audience filtering. Research has shown that audiences who read text-based content generally have a higher level of education compared to those who watch short videos. Their willingness and ability to pay are also stronger.&lt;/p&gt;

&lt;p&gt;Therefore, I recently conducted an experiment based on the theme "Which Writing Platform Really Works for newbie tech writer in 2023" drawing from my personal experience. The results were quite unexpected. In this article, I will disclose the entire experimental process and the final conclusions. If you are a budding content creator, I believe this will provide some insights for you.&lt;/p&gt;

&lt;h2&gt;
  
  
  Experiment Conditions and Environment Setup
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Selected Content Area: For the purpose of testing the platform, I deliberately avoided popular content areas such as AI. This is because I took into consideration that if I were to choose an exceptionally trending topic, it could be challenging to discern whether the traffic came from the topic's popularity or the inherent outreach capability of the platform. Hence, I chose three themes that weren't extremely popular but weren't too niche either: &lt;a href="https://hackernoon.com/over-40-with-no-technical-background-this-is-how-i-learned-html-and-css-in-3-days" rel="noopener noreferrer"&gt;Over 40 with no technical background, this is how I learned HTML and CSS in 3 days&lt;/a&gt;, &lt;a href="https://hackernoon.com/over-40-with-no-technical-background-this-is-how-i-learned-javascript-in-2-weeks" rel="noopener noreferrer"&gt;Over 40 with no technical background, this is how I learned Javascript in 2 weeks&lt;/a&gt;, &lt;a href="https://hackernoon.com/over-40-with-no-technical-background-this-is-how-i-learned-a-frontend-framework-in-2-weeks" rel="noopener noreferrer"&gt;Over 40 with no technical background, this is how I learned a frontend framework in 2 weeks&lt;/a&gt;.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Selected Content Platforms: Taking into account the writing habits of tech writers and the reading preferences of their audience, I chose Twitter, dev.to, Medium, and Hackernoon as the platforms for this experiment. These platforms are quite familiar to content creators, so I won't delve deeper into their specifics here. In essence, they all serve as platforms for distributing text and image content. Their fundamental principle revolves around algorithmically distributing content to an audience, subsequently redistributing it based on engagement data, potentially multiple times.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Conditions of the Experiment: I registered new accounts on all platforms, starting cold with zero followers, using identical registration details (profile picture, username, bio, etc.). I have no technical background, no experience in English writing, and English isn't even my native language. I meticulously controlled the timing of content releases, ensuring almost simultaneous publication on all four platforms. Regarding the content, over three weeks, I posted identical articles on all platforms—the three articles mentioned above. After publishing, I did not promote any of the articles myself, nor did I ask anyone to like, comment, or share.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Performance of Each Platform
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Twitter was a platform I had high hopes for from the beginning. In addition to publishing the three articles, I was also active on Twitter in my daily routine. For instance, when I completed a course, I would post a "check-in" &lt;a href="https://twitter.com/kwg6qlyv/status/1682301623698178048" rel="noopener noreferrer"&gt;like this&lt;/a&gt; and tag the tutorial author I wanted to thank. Moreover, in the three articles I posted on Twitter, I tagged and thanked the respective authors of the referenced tutorials. At the end of my articles, I also included some hashtags in hopes of attracting more traffic. A month later, the view counts for my three articles were 75, 80, and 43, respectively. None were retweeted. Each article received roughly 2-3 likes. Furthermore, I gained six new followers in that month. Considering I started from scratch with no followers, although I wasn't extremely pleased, I wasn't overly disappointed either.
&lt;img src="https://media.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%2Fcud1uf48dwzyyk9iah37.png" alt="Image description"&gt;
&lt;img src="https://media.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%2Fo2xbu01f3rmjoky8m89t.png" alt="Image description"&gt;
&lt;img src="https://media.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%2Feqrodq32diltf0jgfm6h.png" alt="Image description"&gt;
&lt;/li&gt;
&lt;li&gt;dev.to was a platform I wasn't very familiar with, and I initially approached it with a "let's give it a try" mentality. My conclusion now is that it's perhaps not the most beginner-friendly, with its challenges potentially even greater than writing long articles on Twitter. After a month, my Dashboard showed all my articles had "&amp;lt;25" views. I'm not sure about the exact number of meaningful views on dev.to, but it's likely very low, possibly in the single digits. Over the month, I gained two followers, which might not seem significant considering the time and effort I put into writing.
&lt;img src="https://media.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%2Fabvscmteivu9anyiswlm.png" alt="Image description"&gt;
&lt;/li&gt;
&lt;li&gt;Medium was once a renowned platform, arguably the most prominent for text-image content creation. Not only does it have a vast user base, but it also boasts content creators from various domains, not just tech writers. Hence, I had high expectations for it. Reality, however, was a rude awakening. A month on Medium saw my three articles garnering only 16 views in total, which was disheartening. I received no comments and gained no followers. Given Medium's user base and influence compared to similar platforms, these results were quite unexpected.
&lt;img src="https://media.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%2F400ngj9oxl4yscjgciq1.png" alt="Image description"&gt;
&lt;/li&gt;
&lt;li&gt;Hackernoon wasn't a platform I had particularly high expectations for at the outset. I felt its user base and recognition might be lesser than Medium's. However, the results took me by surprise.&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Starting from scratch with no followers, the three aforementioned articles on Hackernoon quickly amassed thousands of views! And considering the tens of hours of read-time, it wasn't merely accidental clicks. Readers genuinely engaged with my content!&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Regarding user interaction, not only did many readers like or bookmark my articles, but they also visited my profile page to read more about me. It seemed they were interested not just in the content but also in the creator behind it. This observation is crucial. Often, for tech writers, the conversion rate depends not just on the content but on the trust and interest readers have in the content creator.&lt;br&gt;
&lt;a href="https://media.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%2F6amnfwyuw5ka89eh6bxo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2F6amnfwyuw5ka89eh6bxo.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Furthermore, I distinctly felt that quality content on Hackernoon receives more appreciation and resources compared to other platforms, even if you've just registered. After publishing my third article, it was immediately chosen as a Hackernoon Top Story and got translated into eight languages. For many days afterward, I kept getting notifications like "Your story is trending #X on the daily tech beat!". For a newbie tech writer, setting aside promotional benefits, the writing experience on Hackernoon undeniably surpassed all other platforms :)&lt;br&gt;
&lt;a href="https://media.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%2Fcxiv41emxe5klv1gxt1v.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2Fcxiv41emxe5klv1gxt1v.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Analysis &amp;amp; Conclusions
&lt;/h2&gt;
&lt;/li&gt;
&lt;li&gt;&lt;p&gt;From my modest experiment, it's evident that text-based content still holds a significant place in today's content market. Without any paid promotion, quality written content continues to be powerful. However, with the rise of video and other forms of content vying for user attention, tech writers, whether they're building influence with substantive outputs or conducting targeted content marketing, need to set higher standards for themselves in terms of content, distribution channels, and operations.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;For articles that are infrequently posted and relatively long, Twitter might not be the ideal platform. It's more suited for daily community interactions and the rapid dissemination of high-frequency (but relatively short) information. For longer articles, the concept of long-term tail readership—sustained readership over an extended period after the article's publication—is crucial as it determines the cumulative effect of the content. Due to Twitter's nature, there's hardly any long-tail readership. Each piece of information has a fleeting exposure, quickly overshadowed by newer updates.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;For beginners starting from scratch like myself, a potentially effective strategy (as of 2023) for a cold start might be to disseminate meticulously crafted content on Hackernoon and then actively promote it on one's Twitter or other social media. With the right niche and topic selection, such as opting for domains even more popular than those in my experiment, your content could achieve considerable exposure in a short time, without any promotional costs. Of course, one shouldn't overly focus on short-term results, as content marketing or establishing oneself as a content creator is inherently a long-term and cumulative process.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;For budding content creators, multi-platform publishing and experimentation are meaningful. However, due to differences in recommendation algorithms, user numbers, operational methods, etc., the challenges of a cold start for newbie tech writers can vary significantly across platforms. Some of these platforms might give you a sense of defeat early on, possibly discouraging you from continuing. It's crucial to be mentally prepared for this and have effective strategies in place.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The above is a brief writing experiment I conducted over the past month on the topic: "Which Writing Platform Really Works for newbie tech writers in 2023". If you've had similar experiences or have any opinions on my experiment, please leave a comment. I look forward to engaging with you all!&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>writing</category>
      <category>bootstrap</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Solution to the ConnectTimeoutError Encountered When Verifying Smart Contracts with Hardhat</title>
      <dc:creator>codingJourneyFromUnemployment</dc:creator>
      <pubDate>Sat, 05 Aug 2023 10:54:23 +0000</pubDate>
      <link>https://dev.to/codingjourneyfromunemployment/solution-to-the-connecttimeouterror-encountered-when-verifying-smart-contracts-with-hardhat-2d2i</link>
      <guid>https://dev.to/codingjourneyfromunemployment/solution-to-the-connecttimeouterror-encountered-when-verifying-smart-contracts-with-hardhat-2d2i</guid>
      <description>&lt;p&gt;In the process of learning blockchain programming, whether it's the most popular &lt;a href="https://youtube.com/watch?v=gyMwXuJrbJQ"&gt;video tutorial&lt;/a&gt; on YouTube or the Alchemy's &lt;a href="https://university.alchemy.com"&gt;solidity bootcamp&lt;/a&gt;, content related to Hardhat is inevitable. This is not surprising as in the field of Web3 development, Hardhat is undoubtedly one of the most mainstream frameworks. However, I encountered the same pitfall in the process of learning these two courses, that is, after using Hardhat to deploy smart contracts, I could never succeed in the verification. The same error always occurred:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;An unexpected error occurred:
ConnectTimeoutError: Connect Timeout Error
......
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;I searched on Google for a long time but didn't find a complete solution. Then I tried to ask GPT-4 but still failed to solve it. Eventually, I found some insights in this &lt;a href="https://github.com/smartcontractkit/full-blockchain-solidity-course-js/discussions/2247"&gt;post&lt;/a&gt; on GitHub. Now, in combination with the actual process of solving this problem myself, I will record the process of analysis and verification, hoping to help those who also encounter this problem.&lt;/p&gt;

&lt;h2&gt;
  
  
  Firstly, I want to analyze the causes of this problem：
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;I'm using the WSL2 system. The proxy is set in the Windows environment, and the WSL2 system shares the proxy from the Windows environment. Therefore, the solution idea in the aforementioned post did not initially catch my attention. I originally thought that my WSL2 system had set up to share the proxy from the Windows environment, and that I could connect normally using the &lt;code&gt;curl http://google.com&lt;/code&gt; command, so the inability to use Hardhat's verify function should not be a problem with the proxy settings.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Moreover, my error message and the content in the aforementioned post were quite different, aside from the ConnectTimeoutError. Given that Hardhat itself frequently updates, I thought it was an issue with the Hardhat version or a problem with one of its dependencies. What's more, GPT-4 analyzed the situation in the same way at the time, which somewhat misled my thinking.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;I tried to upgrade and downgrade and adjust the versions of libraries and dependencies like Hardhat, @nomicfoundation/hardhat-verify, @nomicfoundation/hardhat-toolbox several times, and even tried to apply for multiple API keys on Etherscan, only to find it didn't help. In the end, I realized that although I globally shared the proxy from the Windows environment in WSL2, the verify plugin might not use the global proxy under the WSL2 environment when Hardhat is running due to some reason.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Problem Solution and Contract Verification Process
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Environment configuration: I have a simple &lt;a href="https://github.com/codingJourneyFromUnemployment/my-upgradeable-contract"&gt;example project&lt;/a&gt; here, which deploys an upgradeable contract. You can refer to my package.json file. Many answers online are quite outdated, but my libraries are all up to date. Of particular note is the need to install the Undici library, which will be used to set the proxy for verification.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Writing the contract and deployment script: This is a standard step and not the focus of this article. But if you are a beginner like me, you can also refer to the simple contract and deployment script in my aforementioned repository. After the writing is done, we can deploy the contract under the Hardhat localhost environment or on the testnet. However, only when deployed on the testnet or mainnet can we use Hardhat's verify plugin.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Apply for an API key on the &lt;a href="https://etherscan.io"&gt;Etherscan&lt;/a&gt; website, which is free. After application, create a new .env file in the root directory of the Hardhat project and paste &lt;code&gt;ETHERSCAN_KEY=yourApiKey&lt;/code&gt; into it. Then set it in the hardhat.config.js configuration file. You can also refer to the configuration method in this file in my repository.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;Use the &lt;code&gt;ip route | grep default | awk '{print $3}'&lt;/code&gt; command to view your IP address, assuming it's &lt;a href="http://xxx.xx.xxx.x"&gt;http://xxx.xx.xxx.x&lt;/a&gt;, then check the "LAN" corresponding HTTP port through the VPN client in your Windows environment, assuming it's yyyyy. Add the following content to your hardhat.config.js file:&lt;br&gt;
&lt;/p&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const { ProxyAgent, setGlobalDispatcher } = require("undici");
const proxyAgent = new ProxyAgent("http://xxx.xx.xxx.x:yyyyy");
setGlobalDispatcher(proxyAgent);
&lt;/code&gt;&lt;/pre&gt;

&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Please note that you should not use the IP address and port in the aforementioned GitHub post, because everyone's VPN client and IP are different. The post also mentioned looking at the DNS server IP using &lt;code&gt;cat /etc/resolv.conf&lt;/code&gt; and adding it to the configuration. But if you, like me, share the Windows proxy in the WSL2 environment, then your DNS is likely set by yourself, such as 8.8.8.8. So using the method I mentioned in the fourth point above is the safest. Also, don't forget to turn on options like "Allow LAN connections" in your VPN client. If your client doesn't have this option, you may need to switch to another one.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Use the &lt;code&gt;npx hardhat verify --network yourNetWork CONTRACT_ADDRESS&lt;/code&gt; command to verify the contract, or you can write an additional verification function in the deployment script, which will complete the verification immediately after deployment.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h1&gt;
  
  
  solidity #hardhat #ETH #etherscan #SmartContracts
&lt;/h1&gt;

</description>
      <category>solidity</category>
      <category>hardhat</category>
      <category>ethereum</category>
      <category>smartcontract</category>
    </item>
    <item>
      <title>Over 40, with no technical background, this is how I learned a Frontend Framework in 2 weeks</title>
      <dc:creator>codingJourneyFromUnemployment</dc:creator>
      <pubDate>Fri, 21 Jul 2023 03:35:45 +0000</pubDate>
      <link>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-a-frontend-framework-in-2-weeks-3723</link>
      <guid>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-a-frontend-framework-in-2-weeks-3723</guid>
      <description>&lt;p&gt;In the past two weeks, I've shared my personal experiences of rapidly learning the basics of HTML, CSS, and JavaScript, without any prior knowledge, experience, or guidance. However, if your goal, like mine, is to become a full-stack web developer or an independent developer capable of creating your own products, mastering these three basic tech stacks is not enough. So, this week, I'll be sharing a complete beginner's guide to quickly learning the basics of a frontend framework and creating simple products. All the learning resources involved in this post are free!&lt;/p&gt;

&lt;p&gt;After finishing my learning, I made a web app like this &lt;a href="https://fireblogs-50850.web.app/"&gt;web app&lt;/a&gt;. Please forgive me for not deploying my own project but using the project example in the related tutorial instead. Here is my own &lt;a href="https://github.com/codingJourneyFromUnemployment/FireBlog"&gt;repository&lt;/a&gt;. In fact, I've replicated over 90% of all the effects in the sample project. The reasons for not deploying will be discussed later. As you can see, this is a relatively complete project, involving many aspects such as frontend and backend communication, frontend animation design, lifecycle hook design, backend data structure design, state management, route management, and so on. I even integrated a rich text editor and tailwindcss into this project, making the frontend look very professional. If even I can quickly master the basics of a frontend framework, why can't you?&lt;/p&gt;

&lt;h2&gt;
  
  
  As usual, let's first talk about the detours I took during my frontend framework learning process.
&lt;/h2&gt;

&lt;h3&gt;
  
  
  With so many frontend frameworks, which one should a beginner choose?
&lt;/h3&gt;

&lt;p&gt;This is one of the most confusing questions for beginners, especially self-taught beginners. It's a highly personalized question that involves your basic skills, learning path choice, learning ability, short and long term goals, and even the country and region you live in. Therefore, it is difficult to give a standard answer. Beginners often lack knowledge and industry experience to evaluate the best option among all these factors.&lt;/p&gt;

&lt;p&gt;This is a crucial issue because the frontend framework is closely related to the main programming language you use when building a web app. Also, if you choose a less popular framework, you may find it hard to find relevant community resources, and even feel constrained when taking courses and collaborating with others. I've been confused about this for a long time and even tried learning Flask and Django, but eventually gave up for various reasons.&lt;/p&gt;

&lt;p&gt;I could write a 10,000-word article about this issue, but that's not the point of today's post. So here's my short answer: If you're looking for a job, it's best to learn React and make it your main framework. If you're a beginner like me with little prior knowledge and want to learn quickly, build quickly, and develop products independently in the future, then you can choose Vue3. Its learning curve is relatively smoother and easier for beginners to get started.&lt;/p&gt;

&lt;h3&gt;
  
  
  Is it enough for a beginner to just learn one framework?
&lt;/h3&gt;

&lt;p&gt;I once thought that choosing one frontend framework in the ecosystem of my main programming language would solve all problems because mainstream frameworks have very rich ecosystems that can handle all kinds of scenarios in development. However, as I gradually learned other courses and built products, I realized this idea was naive.&lt;/p&gt;

&lt;p&gt;For example, I'm currently learning Alchemy University's Solidity bootcamp. The official prerequisite for this course is a basic knowledge of JavaScript. I thought I could handle this course easily since I had not only learned HTML, CSS, JavaScript, but also Vue3. However, in the third week, I suddenly found out the week project was built with React's frontend. I was dumbfounded. Fortunately, the week project was straightforward and only required the basics of React. Still, even so, it took me half a day to quickly learn the basics of React, and I finally completed the week project successfully. So, as a beginner, never pin your hopes on a single tech stack. Quick learning and adaptability are essential skills for us.&lt;/p&gt;

&lt;h2&gt;
  
  
  My Front-end Framework Learning Strategy
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Simplicity, Practicality, and Goal-Orientation
&lt;/h3&gt;

&lt;p&gt;I'm not expecting to become an expert in a front-end framework in just 2 weeks. Despite Vue3 being more beginner-friendly than React, it's ecosystem is rich and full of content, including numerous documents such as Vue3's own, Vite, Vue Router, Pinia, and more. If you want to build a quality frontend UI, you also need to study UI libraries like Element Plus. Plus, if our product has some special features, we need to learn some libraries specifically for that feature, such as the rich text editor, wangEditor, that I integrated into my web app.&lt;/p&gt;

&lt;p&gt;It's impossible to learn all of this in 2 weeks, so I've set my goal to grasp the core functions of Vue3 and initially build a professional-looking frontend.&lt;/p&gt;

&lt;h3&gt;
  
  
  Centering Around Vue3 Documentation and Gradually Increasing Practice Complexity
&lt;/h3&gt;

&lt;p&gt;I've reviewed many documents since I started self-study programming, and I must admit Vue3 is one of the most beginner-friendly ones. The excellent writing of the documentation made it possible for me to learn front-end frameworks. Therefore, instead of recommending any third-party tutorials, I strongly suggest those who want to learn Vue to make Vue3's own &lt;a href="https://vuejs.org/"&gt;documentation&lt;/a&gt; their core study material.&lt;/p&gt;

&lt;p&gt;Having good study materials alone is not enough to master a framework; the best way to grasp a framework is to use it to build projects. However, trying to build the web app I demonstrated at the beginning of this article might not be a good idea. I actually built two projects during my study, the first one being very simple, mainly to get a feel for using the framework, understanding the general process and the core parts. The second project is an extension of the first, learning how to find the resources needed to build a real web app within a framework's ecosystem.&lt;/p&gt;

&lt;h2&gt;
  
  
  Study Time and Schedule
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;I spent half a day sorting out the possible learning resources, mainly some documents and two carefully selected project tutorials. The documents include the following: &lt;a href="https://vuejs.org/guide/introduction.html"&gt;Vue3 documentation&lt;/a&gt;, &lt;a href="https://v3.vitejs.dev/guide/"&gt;Vite documentation&lt;/a&gt;, &lt;a href="https://router.vuejs.org/guide/"&gt;Vue Router documentation&lt;/a&gt;, &lt;a href="https://axios-http.com/docs/intro"&gt;Axios documentation&lt;/a&gt;, &lt;a href="https://element-plus.org/en-US/"&gt;Element+ documentation&lt;/a&gt;, and &lt;a href="https://pinia.vuejs.org/core-concepts/"&gt;Pinia documentation&lt;/a&gt;. Vue3 documentation is the most crucial among these.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Then, I spent about 3 and a half days reading most of the Vue documentation. The focus is on the basics, and even as a beginner, I guarantee you can get through this part without difficulty. However, as I got to the later parts, some content gradually became less clear. That's normal for beginners, and it's okay. The parts I couldn't understand for now, I noted them down and moved on. Some parts, like Best Practices, TypeScript, and Advanced Topics, I decided to skip entirely. In short, if you just focus on the most essential and basic parts, 3 and a half days is ample time. I'm not a quick learner and my basics were weak, maybe you won't need as much time.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;In the next day and a half, I followed a classic &lt;a href="https://www.youtube.com/watch?v=qZXt1Aom3Cs"&gt;free tutorial&lt;/a&gt; from Traversy Media and did a small project - a task tracker. I particularly want to talk about Brad's teaching style here. He is certainly a legendary figure, considered the godfather of programming by many self-learners. Every time I watch his courses, I learn a lot. He is very good at using a small project to fully demonstrate all the aspects one needs to learn within a technology stack. ** But as a newcomer, you have to pay attention to one thing, do not listen to his classes without any foundation. ** Because Brad's teaching style is very concise and elegant. If you don't have any basics, you may not be able to keep up with his pace. Therefore, I deliberately scheduled this small project tutorial in the second stage of my learning, not the first.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;If you have seriously followed his tutorial, I believe you have found the feeling of building a front-end with a framework, but at the same time, you have more questions. That's how I was, I couldn't wait to quickly browse the documents of vite, vue Router, Axios, and pinia. This time I only spent a day and a half. Because I already roughly know what basic knowledge of the above technology stack is needed to build a vue3 project, I focus on these contents. And other relatively complicated but not so commonly used contents, I just quickly browsed. If you don't understand it all at once, just skip it.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;By the second week, I was confident enough to consolidate the basic knowledge I learned in the first week by building a relatively complex project. And according to the needs of building a real web app, expand the content learned earlier. This time I still chose a popular &lt;a href="https://www.youtube.com/watch?v=ISv22NNL-aE"&gt;vue tutorial&lt;/a&gt; - FireBlog from Traversy Media. This tutorial is explained by &lt;a href="https://twitter.com/john_komarnicki"&gt;John Komarnicki&lt;/a&gt;, let me explain why I chose this tutorial.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The advantage of this project is that it is very complete, with a professional front-end user interface and a backend api implemented with the help of firebase. The entire project involves many aspects such as front-end and back-end communication, front-end animation design, lifecycle hook design, back-end data structure design, state management, route management, and so on. I even learned a lot of content that I didn't understand when reading the documentation during the construction process. If we want to develop web apps in the future, this is a great opportunity for practical experience.&lt;/p&gt;

&lt;p&gt;Its main disadvantage is that this is a tutorial from two years ago, so inevitably some technology stacks have been upgraded. For example, the vue-cli used in the tutorial is now in maintenance status, I used vite when building. Another example is the rich text editor used in the tutorial has not been updated for a long time, I used wangEditor which is also lightweight but has more recent maintenance and integrates better with vue3 when building.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;The backend of this tutorial uses firebase to build, although not complicated, it may not meet our own practice needs. For example, my ideal backend is a restful API built with node.js+express+mongodb+mongoose. Therefore, I did not follow the tutorial to build a firebase backend, but temporarily built a virtual backend with &lt;a href="https://www.npmjs.com/package/json-server"&gt;json-server&lt;/a&gt; to simulate the behavior of a restful API. This is also why I did not deploy my project online. Because both github page and vercel can only deploy static web pages, and the terminal of json-server can only run locally, it cannot be deployed on them. You can choose according to your own needs when following this tutorial, or you can build a firebase backend like it.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;This tutorial lasts for six and a half hours. Normally, if you study one hour's content every day, six days should be more than enough. As I'm older, my learning speed is slower. You may be able to complete the build in less than six days. On the last day, I still reviewed the previous content as usual, the most important thing is to organize the notes I made during the two weeks of learning and make a good cheat sheet. Because I found this action to be crucial. Often, a month after I finish learning, when I open my code again, there are many parts that I don't understand or remember. At this point, if you want to build a new project, notes and cheat sheets can often come in handy.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Some final advice:
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Before, I was always obsessed with finding the "perfect tutorial". But later I found that there is actually no perfect tutorial. Take the FireBlog tutorial we learned in the second week as an example, it has many shortcomings and even some parts do not meet our requirements. But so what? It is still an excellent tutorial and a rare practical project. We only need to upgrade or modify the parts that do not meet the requirements.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Learning a front-end framework is somewhat similar to learning javascript that we talked about last week, don't expect to accomplish everything in two weeks. There is a lot of content in its ecosystem, and it is constantly being upgraded. Not to mention, as we discussed earlier, it's unrealistic to expect to conquer all aspects with just learning one framework, so this is destined to be a continuous learning process. What we need to do is enjoy all this and not see it as a burden.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;If you plan to learn react instead of vue, or even angular, the content I mentioned above still applies. That's how it is with front-end frameworks, the methods of learning and the direction of choosing learning resources are actually quite similar.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h1&gt;
  
  
  WebDevelopment #FrontendDevelopment #VueJS #JavaScript #LearningToCode #CodeNewbie #TraversyMedia #SelfImprovement #SelfTaught #CodingResources #React
&lt;/h1&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
      <category>vue</category>
    </item>
    <item>
      <title>Over 40, with no technical background, this is how I learned JavaScript in 2 weeks</title>
      <dc:creator>codingJourneyFromUnemployment</dc:creator>
      <pubDate>Mon, 17 Jul 2023 07:05:10 +0000</pubDate>
      <link>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-javascript-in-2-weeks-492i</link>
      <guid>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-javascript-in-2-weeks-492i</guid>
      <description>&lt;p&gt;Last week, I wrote an article titled "Over 40, with no technical background, this is how I learned HTML and CSS in 3 days".This article received much positive feedback from friends who found it insightful. Many have urged me to continue sharing my journey of self-learning JavaScript.&lt;/p&gt;

&lt;p&gt;Therefore, in this thread, I'll share a complete strategy for a complete beginner to learn the basics of JavaScript quickly and complete small projects (all resources mentioned in this post are absolutely free!). The following link leads to a simple Chrome extension repository I created after learning the necessary content:&lt;a href="https://github.com/codingJourneyFromUnemployment/leadsTracker"&gt;My Repository&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;As a web3 investor, I track and browse numerous early-stage projects daily. I use this little extension to monitor and save promising projects I've discovered for deeper future studies. I plan to integrate the GPT-4 API into this extension to help analyze project leads I find. If I can quickly grasp the basics of JavaScript, why can't you do the same in a short time?&lt;/p&gt;

&lt;h2&gt;
  
  
  During my learning process, I encountered a few misconceptions:
&lt;/h2&gt;

&lt;h4&gt;
  
  
  What's the point of learning JavaScript
&lt;/h4&gt;

&lt;p&gt;Before I started learning JavaScript, I assumed it was just like Python - just another programming language. As a beginner, I thought learning any popular language, such as Python, would be sufficient. But as I delved deeper, I realized their application directions differed significantly. For studying AI, such as machine learning, Python is a must in the roadmap. However, if you're learning web app development, whether front-end or back-end, JavaScript forms their foundation. You might argue that Python can be paired with Flask or Django. I had the same thought initially, but I found that if you're using an unpopular tech stack, finding fresh tutorials on YouTube could be challenging, let alone the potential difficulties in collaborative development with others in the future.&lt;/p&gt;

&lt;h4&gt;
  
  
  When should you start learning JavaScript
&lt;/h4&gt;

&lt;p&gt;In reality, my journey learning JavaScript was not a straight path. With no teacher guidance or industry experience, I didn't even realize the importance of JavaScript initially. Because I perceived the learning curve for Python to be smoother than JavaScript, I procrastinated entering the realm of JavaScript due to the fear of difficulty. As a result, I wasted quite some time before eventually setting foot on the correct roadmap of web app development.&lt;/p&gt;

&lt;h4&gt;
  
  
  How long does it take to learn JavaScript
&lt;/h4&gt;

&lt;p&gt;Compared to markup languages like HTML and CSS, JavaScript is undoubtedly more complex. From my own learning experience, I believe it's also more complicated than Python. However, I once encountered C language in Harvard's CS50 course (&lt;a href="https://www.youtube.com/@cs50"&gt;CS50 YouTube channel&lt;/a&gt;), and I feel JavaScript is much simpler in comparison. Having learned Python before, I initially hoped to fully master JavaScript within a week or two. However, I soon realized this expectation was unrealistic. JavaScript is vast, and within two weeks, we can at most grasp the basics and be prepared to move on to the next phase of learning. For instance, you might want to start learning AU's Solidity training camp (&lt;a href="https://university.alchemy.com/overview/ethereum"&gt;AU's website&lt;/a&gt;), or freecodecamp's React course (&lt;a href="https://www.youtube.com/watch?v=2-crBg6wpp0"&gt;YouTube link&lt;/a&gt;), and so on.&lt;/p&gt;

&lt;h2&gt;
  
  
  My learning strategy
&lt;/h2&gt;

&lt;h4&gt;
  
  
  Overall Principle
&lt;/h4&gt;

&lt;p&gt;Time is quite limited, and our goal isn't to become a master of JavaScript, but to grasp the basics so we can start practicing and move on to the subsequent tech stacks in the learning roadmap. Therefore, "simple basics but efficient" should be the principle we adhere to in our two-week study. This overall principle should be reflected in our choice of learning resources, the arrangement of the process, and the selection of practice projects. For instance, if we have a thick book like "JavaScript: The Definitive Guide", we shouldn't read it from cover to cover, but use it as a reference book (like a document), referring to the corresponding parts when we encounter problems.&lt;/p&gt;

&lt;h4&gt;
  
  
  With the basic goals and guiding principles in mind, the rest is easy.
&lt;/h4&gt;

&lt;p&gt;I spent half a day browsing various tutorials and other learning resources online and collected those that align with my goals and principles for future use. When I first learned JavaScript, I greedily chose a lengthy video tutorial that spanned several hours, but in the end, I couldn't keep up and gave up. Therefore, this time, I deliberately avoided tutorials that could be challenging for a beginner to complete. However, I also realized that some tutorials online can be misleading, like those on YouTube titled "Learn XXX in 1 hour". These overly fragmented and short tutorials only serve as introductions and don't meet our learning goals and principles.&lt;/p&gt;

&lt;h4&gt;
  
  
  This time, I divided my two-week study into two stages.
&lt;/h4&gt;

&lt;p&gt;The goal of the first stage is to understand the concepts and basic usage of JavaScript as completely (yet simply) as possible. The second stage involves following a quality video tutorial for practice and completing a few small projects to deepen my understanding of JavaScript. Therefore, in the first stage, I chose a quality JavaScript tutorial on GitHub as my primary resource (&lt;a href="https://javascript.info/"&gt;The Modern JavaScript Tutorial&lt;/a&gt;). Although this tutorial is free, its tens of thousands of stars on GitHub attest to its authority. The only thing to note is that based on our goals and learning principles, we don't need to and don't have time to complete the entire tutorial. We only need to focus on the goal of the first stage, that is, mastering the basics and understanding the concepts.&lt;/p&gt;

&lt;h2&gt;
  
  
  My time and process arrangement
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Having previously studied Python and Harvard's CS50, I knew that a programming language certainly includes basic content such as variables, functions, data types, and logical operations. I also knew that in object-oriented programming languages there are basic concepts like classes and objects. Therefore, I progressed very smoothly in the first few days. On the first day, I completed reading and exercises for the "An Introduction", "JavaScript Fundamentals", and "Objects: the basics" sections of the tutorial. I skipped the "Code Quality" part and some exercises that I couldn't understand yet, focusing solely on the basics.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;On the second day, I started with "Data types" and "Advanced working with functions". Honestly, these two parts also have a lot in common with Python, which I had studied before, so it wasn't particularly difficult for me to understand. The only thing that took me more time to understand was the concept of arrow functions, which Python does not have. But it isn't complicated either; it's just a kind of shorthand.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;The following few days were the same; I maintained a learning progress of 1-3 sections per day. If I encountered a particularly difficult part, I would only complete one section that day. If the parts were relatively simple, I would finish 2-3 sections that day. As long as I was focused and efficient during my study time, it wouldn't be too rushed. For particularly challenging parts, I would search for more detailed information online or look for the corresponding parts in "JavaScript: The Definitive Guide". For instance, the "Promises, async/await" section was like this, and I spent a whole day studying it.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;It took me about 10 days of intensive work to complete most of the tutorial. But two things need to be noted. First, I skipped many parts that I found to be complicated and not so basic, such as "Code Quality", "Miscellaneous" under "The JavaScript Language", "Miscellaneous" under "Browser", and all the content under "Additional Articles". Secondly, the exercises in this tutorial are relatively difficult, and as a beginner, I couldn't complete many of the problems in a short time. In order to save time and achieve my goals as planned, I would Google the answers or ask ChatGPT for help when I couldn't solve a problem quickly. If I still couldn't answer it, I would decisively give up.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Afterward, I spent an entire day reviewing what I had learned earlier, organizing my notes into a cheat sheet for future reference during project practice. Of course, there are also many JavaScript cheat sheets available online. However, I still strongly recommend you to create your own cheat sheet when learning each technology stack, which can not only deepen your understanding during learning but also improve efficiency when using it afterward.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;In the remaining 3 days, I entered the second stage of my study, consisting of review and project practice. In this stage, I chose a high-quality video tutorial on YouTube, &lt;a href="https://www.youtube.com/watch?v=jS4aFq5-91M&amp;amp;t"&gt;freeCodeCamp's JavaScript Basics Tutorial&lt;/a&gt;. This tutorial was created by Pierre Borgen, a content creator I greatly admire. He excels at imparting programming knowledge gradually through creating small projects. This 7-hour video tutorial is no exception. In it, we can complete three small projects, which is a great way to deepen and reinforce the basic knowledge we learned previously.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;The small projects in this video tutorial are very basic. The seven-plus hours of content divided into three days only require about 2-3 hours each day to complete. In fact, with the foundational knowledge from the first phase of my study, this stage felt quite relaxed. I even added some impromptu enhancements to the projects in the tutorial. For example, when making a Chrome extension for the final project, I didn't use the template provided by the tutorial. Instead, using the HTML and CSS knowledge I'd acquired previously, I designed a simple user interface for the extension myself.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Final suggestions:
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;JavaScript is much more complex than the HTML and CSS you've learned previously. It may be the first real challenge you encounter in your learning journey. However, that's okay because we're beginners, and we only need to understand and master the basics first. When you encounter difficulties, don't be too hard on yourself. Learn to let go, as you'll ultimately have your moments of enlightenment during continuous practice.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Whether you're learning JavaScript or any other tech stack, don't rely solely on existing resources online. Be sure to take your own notes and create your own cheat sheet. This will provide you with significant convenience in your future learning and practice.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;After we've finished learning the basics of HTML, CSS, and JavaScript, there are many more complex tech stacks waiting for us. The journey of learning to code is endless. I once thought it was the most challenging and even hopeless task. However, with continuous learning and self-improvement, I've gradually realized that the endpoint and results may not be the most important. Programming is a creative activity. We can fully enjoy the fun in it and find joy in the process.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Over 40, with no technical background, this is how I learned HTML and CSS in 3 days</title>
      <dc:creator>codingJourneyFromUnemployment</dc:creator>
      <pubDate>Sun, 09 Jul 2023 12:14:54 +0000</pubDate>
      <link>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-html-and-css-in-3-days-416c</link>
      <guid>https://dev.to/codingjourneyfromunemployment/over-40-with-no-technical-background-this-is-how-i-learned-html-and-css-in-3-days-416c</guid>
      <description>&lt;p&gt;Prior to my decision to learn programming, I'd always been in traditional industries. Despite no major complaints about my current job, I felt left behind in this rapidly evolving tech world. Every day we use the internet, yet I knew nothing about the foundational knowledge that builds it, which made me feel uneasy and upset. But the absence of a teacher and industry experience led me to detours in my self-taught programming journey. In this thread, I will share a complete guide for a total beginner to learn HTML and CSS quickly (all learning resources mentioned in this thread are free!). The link below is a simple clone of the YouTube homepage I made after learning the content:&lt;a href="https://codingjourneyfromunemployment.github.io/youtubeCloneDemo/"&gt;youtubeDemo&lt;/a&gt; If I can grasp these two important and fundamental tech stacks quickly, why can't you learn them in a short time?&lt;/p&gt;

&lt;p&gt;Pitfalls:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Regarding learning resources: Today isn't an era of information scarcity, but an era of information explosion. Without spending a dime, we can find plenty of excellent learning resources on the web, be it articles or lengthy video tutorials. Yet, it can make us, as beginners, feel overwhelmed. For example, you may find hundreds of online courses, tutorials, and books for learning Python on the internet. The sheer number of choices may leave you not knowing where to start. I've lost myself in this ocean of information before. I tried to follow several courses at the same time, only to find that I had neither the time nor energy to complete them all. Until later, I realized a principle: Just like when programming, strategy and thinking are always more important than specific codes, clearly defining our long-term learning goals and roadmap is always more critical than any particular materials or tutorials. No matter how excellent or detailed the tutorials are, they are just tools, tools to achieve our goals and roadmaps. Without the North Star, we will lose our way. &lt;/li&gt;
&lt;li&gt;Regarding time and energy: As adults, we all have our work and families, responsibilities that cannot be neglected. So, we certainly don't have as much time and energy as students do to devote to learning all day. At the same time, I found that my learning speed for new things is not as fast as when I was young, which in turn requires me to spend more time and energy to understand and remember new knowledge. This sometimes makes me feel frustrated and even begins to doubt my decision. But as Haruki Murakami said, once you get through the storm, you won't be the same person. In the process of your persistent progress, all feelings of failure and doubts will eventually vanish. &lt;/li&gt;
&lt;li&gt;Regarding tech stack selection: The development of technology today is accelerating. Especially this year, the explosive leaps in the AIGC field and the endless emergence of new tech stacks have left many seasoned tech workers amazed. Some tech stacks that were once very popular suddenly become no longer popular. As a newcomer who hasn't even started, seeing these abstruse concepts and codes, I often feel confused about which tech stacks I should learn. I wonder if it would be a waste of time and energy after learning. It was not until I read a large number of blogs from tech experts that I realized a consensus among excellent tech workers: No matter how technology develops, how new tech stacks evolve, the basics are the most important. For example, even today, HTML, CSS, and Javascript are still the basis of all web applications. No matter what new framework or tech stack you learn, it's impossible without understanding these three basics.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Learning strategy:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;After a long period of exploration and hesitation in the early stage, I finally clarified my future goal to become a full-stack developer, capable of developing web apps independently. Therefore, the learning roadmap was apparent. According to my target, I devised a learning strategy of starting with front-end, then back-end, and finally blockchain + artificial intelligence, basic before framework. HTML, CSS, and Javascript are all just the basics of front-end. The content of Javascript is relatively large, and as a programming language, its complexity and learning curve are much higher than HTML and CSS, so I put it behind. As for HTML and CSS, both are markup languages, relatively simple, three days are enough. &lt;/li&gt;
&lt;li&gt;I divided three days into six half-days, each half-day focused on one theme. In the first and second half-days, I focused on learning HTML, starting with basic tags, then learning how to layout, embed images, and links, etc. In the next two half-days, I focused on CSS, learning how to use it to beautify web pages, modify fonts, colors, and layouts, etc. On the last day, I devoted all the time to follow a quality tutorial on YouTube to do a small project - cloning the YouTube homepage, thus practicing all the knowledge I learned. Adult learning should follow the "Learn, Practice, Use, Create" stages. Obviously, 3 days is not enough to reach the Use and Create stages, but by truly creating some actual small projects, we can basically complete the Learn and Practice stages.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Learning resources and process:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Due to limited time, I couldn't choose lengthy video tutorials that take tens of hours. As a beginner, I also couldn't pick those seemingly short but demanding lots of prior knowledge tutorials or documents. Therefore, a balance needed to be considered. So on the first day, I spent some time quickly completing &lt;a href="https://htmldog.com/guides/html/beginner/"&gt;the HTML Beginner Tutorial&lt;/a&gt; and &lt;a href="https://htmldog.com/guides/html/intermediate/"&gt;HTML Intermediate Tutorial&lt;/a&gt; on the htmlDog website. This part is straightforward, even for a novice with zero foundation. Still, after learning, I had an idea of what HTML is and what it can do. 
With these basic concepts, the following steps were easy. For the rest of the day, I opened the &lt;a href="https://www.w3schools.com/html/default.asp"&gt;w3school webpage&lt;/a&gt; and quickly went over the HTML-related content. I set aside the ones I didn't understand for the time being, focusing on mastering the usage of some common tags, and reinforcing the content I learned in the morning.&lt;/li&gt;
&lt;li&gt;On the second day, like the first day, I quickly completed &lt;a href="https://htmldog.com/guides/css/beginner/"&gt;the CSS Beginner Tutorial&lt;/a&gt; and &lt;a href="https://htmldog.com/guides/css/intermediate/"&gt;CSS Intermediate Tutorial&lt;/a&gt; on the htmlDog website. It's also a simple introductory course suitable for beginners to understand the basic concepts. For the rest of the day, I again devoted to &lt;a href="https://www.w3schools.com/css/default.asp"&gt;w3school's CSS content&lt;/a&gt;. If you have time, I recommend browsing the book "CSS in Depth" by Keith J. Grant. Reading it all will undoubtedly take a lot of time, but we only need to look at the first chapter for now. After reading the first chapter, you will have a deeper understanding of the underlying logic of CSS operation.&lt;/li&gt;
&lt;li&gt;The whole day and night of the third day, I mainly followed a quality tutorial on YouTube to complete my practice project. I have browsed countless HTML and CSS video tutorials online, but I can assure you that this is the best one I have seen. This guy is legendary, he's excellent at letting beginners and dummies like me quickly understand concepts and code and apply them to practice. &lt;a href="https://www.youtube.com/watch?v=G3e-cpL7ofc"&gt;This video&lt;/a&gt; is over 6 hours long, and it's not easy to complete it in one day. Even though the study of the past two days has given me a lot of basic knowledge and simple uses of HTML and CSS, I fought from early morning to late night on the third day to barely keep up with the whole tutorial. Without the foundation of the first two days of study, I'm sure I couldn't finish this tutorial in one day.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Final suggestions:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;As a beginner, learn to reconcile with yourself and calmly accept your clumsiness at the beginning. Because this is very normal, it's just a regular process of learning new things, after all, most of us are not geniuses.&lt;/li&gt;
&lt;li&gt;If you haven't set a long-term learning goal (like I hope I can develop web apps independently in the future), you can first set a shorter and smaller target, such as writing a simple Python program (e.g., a weather forecast app). Then, you can research what kind of learning resources (books, courses, tutorials) will help you reach this goal. The advantage of this is that you can focus your attention, avoid being disturbed by irrelevant information, and you can apply your new knowledge in a practical project immediately. &lt;/li&gt;
&lt;li&gt;Value interaction with the community, but don't rely completely on others' help. Instead, make good use of tools to solve encountered problems. I've read many experience posts about learning to program, and they all emphasize integrating into the community and getting community help. However, when I truly encountered problems, I found that timely and effective help was not necessarily available from social networks or Q&amp;amp;A sites like Stack Overflow. In fact, most of the problems I encountered were solved through Google and ChatGPT, especially when we are pursuing efficiency in learning!&lt;/li&gt;
&lt;li&gt;If we harbor ideals, are willing to challenge ourselves, explore the unknown, then age, background, money, intelligence, nothing will become obstacles to us changing ourselves and growing continuously. Regardless of where we are, at what stage of life, we can all become better! &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That concludes my week of self-learning experience. I'm sincerely sharing it in the hope that it can be helpful to some extent for other self-learners. The path of self-learning is not easy, but as long as we stick to it and keep moving forward, I believe we can all achieve our goals. Stay hungry, stay foolish. Let's keep learning and growing!&lt;/p&gt;

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