Create your own blog with React (MERN Stack)

June 2024 is a very hot month unlike any other June. Are you all studying hard? Or are you working at your current job?

I started building my own platform to publish the 'Node FullStack Development Guide (3-part series)' course around the end of 2023, create new courses in new languages, and service them directly.

That new language is~~~!!!

This is the famous Rust that developers want to learn every year.

What happened when I moved to Rust, which was known to be difficult?

Since JavaScript experts have already laid the foundation for the ecosystem, I am learning more easily than I thought and developing web with a new framework.

The framework I use is called 'Leptos', and I personally think it is the most complete at the moment, and it seems like it will reach the level of React (although React is not a framework) and NextJS~~~

Also, it is a Rust web framework that I think is leading the isomorphic development that NextJS is aiming for.

But... if you develop it, you develop it, so why are you announcing it as new news!!!

Normally, when developing with Node , you start with JavaScript and then move on to TypeScript , but

I wrote this post to recommend that you learn Rust and use it for web development with WebAssembly instead of learning TypeScript, which has no performance advantages other than the benefits of types (collaboration, uniformity, predictability, etc.).

As of June 2024, there are almost no relevant books or lectures, so you have to learn only from the leptos docs and the relevant GitHub examples, which is a big disadvantage, but once you get used to it to some extent, you will be amazed by the uniformity of code with the type strictness unique to Rust, and the speed that is comparable to C and C++. (Currently, Chat GPT-4o doesn't know leptos well either...ㅠㅠ)

Once I finish developing the platform, I will prepare a lecture on WebAssembly through leptos. The lecture will consist of two parts.

1. Basic CRUD lecture through leptos

2. Create your own blog with leptos (Create your own blog with Rust version of React)

But it will take at least 1~2 years to prepare for this haha

So, rather than my insufficient lecture, I wanted to encourage those who have learned some JavaScript to try Rust, and I wanted to introduce the charm of Rust first while developing with leptos.

【1-line summary】 If you've learned JavaScript, study Rust instead of TypeScript!!! It's easier than you think~~~^^

※ As of June 2024, Git repository (20% completion)

※ (Note) Also study Nix flake. It is a kind of virtualization of Python, and Nix flake generalizes it.

'Node FullStak Development Guide' roadmap coupon issuance has started.

'Colini Web Development Guide (Part 1 / For Beginners)', 'Node FullStack Development Guide (Part 2 / For Beginners)', 'Terraform Deployment Guide (Part 3 / For Previous Course Takers and Intermediate Level Students)' lectures are gathered in one place.

We have released a roadmap titled 'Node FullStack Development Roadmap, A to Z' .

This course is about microservice development and is structured so that anyone from beginners to intermediate level can choose the course they want to take.

Participation in this roadmap is free , and upon participation, you will be issued a 20% discount coupon for three lectures .

There is no time limit, so if you are interested, feel free to participate at any time~~~ ^^

※ Roadmap address: https://www.inflearn.com/roadmaps/731

I also opened an Instagram account. I will be posting development news and daily life, so please like, follow, and give a heart~~~^^

※ Instagram address: https://www.instagram.com/ssaplecode

'Terraform Deployment Guide'

• Just store your code in Git

• Automatically run Terraform code via Git Actions

• In the 'Node FullStack Development Guide', I changed the application created with Docker to the prod state.

• Learn how to deploy to Azure

If you are thirsty for distribution methods, buy it during the early bird discount that runs until 2023.11.30 ~~!!!

Purchase address: https://inf.run/2GAGp

※ Please note that the recently released 'Node FullStack Development' (3 parts in total) series will also be guided by a roadmap ^^

It's been a really long time since I've greeted you. (I'm sorry I couldn't greet you for a while 😭 )

Finally~~!!! I'm back with a new lecture after 3 years.

The name is 'Node FullStack Development Guide' and it consists of three parts.

Let me briefly introduce the lecture.

1. Colini Web Development Guide (Part 1) <Move to lecture>

   1. Course for complete beginners (Study HTML, CSS, Javascript, React)

2. Node FullStack Development Guide (Part 2) <Move to lecture>

   1. This course is for those who have passed the beginner level.

   2. Let's create a shopping mall with Docker, Nginx, Postgresql, SNS Login, and Kakao Pay implementation.

   3. We carry out everything from development to final finishing with Docker.

3. Terraform Deployment Guide <Move to lecture>

   1. This lecture is for those who know how to implement web with React.

   2. We run Kubernetes using Terraform, the latest deployment technology.

   3. We have created a stage to distribute the shopping mall created in Part 2 so that you can take the course independently without any problems even if you haven't taken Part 2.

The Early Bird 30% discount will only be available for one month (10/31~11/30).

Don't miss out on the subsequent discounts, which are not separate from the official Infraon discount or the basic 10% discount when purchasing a roadmap~~

There are many changes that have occurred since react-router-dom was upgraded to version 6.

This lecture was created based on version 5, so when installing,

npm i react-router-dom@^5

Please install it.

Please use npm i node-sass@4.14.1 .

Because I'm lazy... ㅠㅠ

I was going to write this as a question comment and make an announcement, but... I'm only posting it now.

Thank you to the students who asked questions. *^^*

1. Import method has been changed.

(Old) import CKEditor from "~~" -> (Changed) import {CKEditor} from "~~"

2. CKEditor changed from onInit to onReady

<Other references> https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/react.html

[Notice] How to resolve nodemon, babel-node conflict issues / (5) Express Start lecture related

If you are currently using Windows, please do not use nodemon and proceed with the method below.

[cause]

There is an issue where nodemon and babel-node do not work properly together on Windows (either running twice or options like ignore do not work properly).

[Solution]

(install) npm i babel-watch

(script) added

"dev-watch" : "babel-watch server/server.js --ignore'./client'" ,

(Running server)

npm run dev-watch

If you change it like this, the server will not be restarted when performing front-end work after the server is started.