“Live up to the time, the creation of non-stop, this article is participating in 2021 year-end summary essay competition”


Hello everyone, I am The Nuggets harvest chicken Ben 🐔…

This is so annoying. Let’s do it again. Hello!

My name is Da Shuai, an old programmer. This article will draw a lucky goose in the comments to get a gold nuggets peripheral mouse pad.

Special thanks to

Here I want to thank one person first, that is @Great Sage. Without him standing up for me in front of HR (I didn’t know him before the interview), I would never have been able to re-enter the workforce at 37 with a high school degree. Without his encouragement from the team, I probably wouldn’t have been so motivated to write articles and get the satisfaction I needed to become a lifelong creator of technical content.

Thank you, captain, little Shuai, village head, Old Xia, little butterfly, Qian sister, Siyu, Alex, SSH, Autumn wind, Coco, Kagol, Cui CXR, Sanyuan, Winter and so on [all] who have communicated with each other this year. Please continue to support Big Shuai. In no particular order, but don’t get mad if you miss it, come to me and buy you a leg of lamb

Thank you. Let’s start with some liver!

I’ve been sick for a weekThree.jsAnd created a “gold-digging city.”

Liver?

Let’s look at the end result

The data source

How many articles did I write with the Nuggets in 2021?

I would love to know how many articles I wrote for the Nuggets this year and how many likes each one had. But the Nuggets don’t offer a year-by-year interface. As a last resort, I used the article list interface to iterate, and if I found an article that was created earlier than 00:00:00 on January 1, 2021, I ended up iterating to get all the articles I posted this year.

// Get 10 articles at the specified pointer position
function getArticles(uid,cursor='0'){
	const res = await uniCloud.httpclient.request("https://api.juejin.cn/content_api/v1/article/query_list", {data: {"cursor": cursor,
			"sort_type": 2."user_id": uid
		},
		headers: {"Content-Type":"application/json"
		},
		method:"POST".dataType:"json"
	})
	
	return res.data.data;
}

// Get the article until xx timestamp
function getArticlesAfter(uid,unixtime){
	let dataByYear = {};
	let cursor = 0;
	
	async function getNextArticles(){
		let res = await getArticles(uid,cursor);
		
		console.log(res);
		if(! res)return dataByYear;
		
		let getTheLast = false;
		
		for(let i = 0; i<res.length; i++){var article_item = res[i];
			
                        // Stop traversal if an article is found to be less than the timestamp
			if(article_item.article_info.ctime<unixtime){
				console.log('It's over. The last post of last year was:');
				console.log(article_item.article_info.title);
				getTheLast=true;
				break;
			}else{
                                // Articles found later than December 31, 2021 will be skipped
                                // There will still be access to this interface in 2022, so there will be no problem
				if(article_item.article_info.ctime>1640966400)continue;
				
				var cDate = new Date(parseInt(article_item.article_info.ctime)*1000);
				var month = cDate.getMonth();
				
				if(! dataByYear[month])dataByYear[month]=[];// Reorganize the data structure without using so many fields
				var sItem = {
					title:article_item.article_info.title,
					author_name:article_item.author_user_info.user_name,
					article_id:article_item.article_info.article_id,
					view_count:article_item.article_info.view_count,
					digg_count:article_item.article_info.digg_count,
					comment_count:article_item.article_info.comment_count,
					ctime:article_item.article_info.ctime
				}
				dataByYear[month].push(sItem);
			}
		}
		
		cursor+=res.length;
		
		if(! getTheLast)return getNextArticles();
		else return dataByYear;
	}
	
	return getNextArticles();
}
Copy the code

Then, all articles are reorganized according to month, and the final data structure is as follows:

I also provide this interface to everyone, if you are not satisfied with my form of expression, you can also deal with these data by yourself.

But I do not guarantee that the interface will work for a long time!

https://e0b75de1-90c7-4c11-9d12-a8bc84c4d081.bspapp.com/http/jjskyline?uid= the nuggets uidCopy the code

Representation of data

Originally I was going to just copy Skyline.github.com

As a result, I spent most of the day trying to draw a base, completely unaware of the difficulty of drawing a three-dimensional trapezoidal structure in three.js.

Finally, I consulted WebGL, who taught me how to use bufferGeometry, which requires all the points of a trapezoid body to be calculated. A trapezoid body has only 8 points, which is easy to calculate.

Unfortunately, when I finally drew the trapezoid, I couldn’t polish it.

Because in order to receive the illumination information, we have to calculate all the vertex normals…

Bald! Since the code is too long and I didn’t use the trapezoid body in the end, I won’t post the code.

Also, I found that the github Skyline format didn’t really fit the nuggets’ annual article data.

So make an original one!

This is made for the Nuggets community

Hey, does anyone want to buy a bill?

Well, no one

Let’s just say I’m bored

It didn’t look like this at first, but I pulled out all my hair to make the city look better. Development side design side live… Various layouts were tried

  • ).

In the beginning, I set the following basic rules for creating a city

1. Each month is one block, 4x3 in total. 2, each article is a building, a maximum of 30 articles per month. The more like the article, the higher the building.Copy the code

Then I found that some articles did not have enough thumbs up data. It was not pretty to draw them according to the data.

  • The second edition

Then I set the ground rules for creating a city 2.0

4. The single-storey area of the building is determined by the number of articles in that month. 5. The layout of buildings in the block is determined by the number of articles in that month. 6. The overall area and block area of all buildings in the block are centered. 7, the height of the building has a base, to ensure that there will not be too short.Copy the code

Is it much more comfortable now, scattered, different sizes, but very neat. However, when the month is odd, the lonely building makes the whole look uncomfortable at last, so we continue to upgrade.

  • The third edition

Basic Rules for Creating cities 3.0

8. If the buildings in the block are odd, the width of the last one is doubled to fill the spaceCopy the code

Does it look better now?

But, also known as the city, is not a chip model?

As it happens, a song was playing in the cloud, and the lyrics went like this

The city is so empty and the memories are so fierce and the streets are so busy that I can hug anyoneCopy the code

Why, the streets! A city must have streets!

  • The fourth edition

Pure hand-painted street map, every pixel I drew in PHOTOSHOP with the mouse.

I’m so bored, again!

TADA! Do you feel something? At this point, I’m running out of volume!

  • The fifth edition

The air in the city is not that clear!

Add some fog

scene.fog = new THREE.Fog(0xffffff.0.01.6);
Copy the code

  • The sixth edition

Just when I thought I was done, I tested @Dashengteacher’s account data.

Well, there’s a lot of greenery, which proves that he really got his hands on it.

He needs to be made ugly because he doesn’t write articles.

Ok, a construction site tile for months without articles

You look at

The sense of both the urban and rural fringe is not out

  • 7th Edition (Attempted)

Block cities don’t feel good, add building models instead. I then open the AssetsStore of Unity3D

This set of models is too beautiful, too suitable!

Only 9.99!

Buy it! Buy it! Buy it!

Just as I was about to order and pay

Say goodbye to unity3D. Look down on my mainland.

Don’t buy the ~

That’s it! No hair pulling ~

End of development

In fact, the whole development process of the original design is far more than the 7th version. In recent days, I have been writing this small webpage live in the small broken station. Many friends have witnessed the development process.

When I wanted to keep poking around and developing these useless things.

I’m being pushed by the Nuggets

Forget it, let’s leave it there…

Try writing your column

Experience the address

No mobile adaptation, please use computer access

Ezshine.jnsii.com/juejincity/…

Change the uid to your own nuggets uid to see your nuggets city

My 2021

Time flies so damn fast…

Sorry, I’m being rude, but I really don’t feel if I don’t say it that way

We have coexisted with the COVID-19 epidemic for two years. When we go out, we are used to wearing masks and washing our hands is the first thing we do….

Three shots of vaccine were given

In the past, I always catch a cold 2-3 times during the change of season

I haven’t had a cold yet this year.

The completion of Flag last year

Last year, 2020, outbreak hit my third startup | Denver annual essay “. The original title was too annoying, so I changed it.

  • Continue to output original quality technical content

This year, I upgraded to LV.6 in the rare-earth mining community and created 39 original articles in total. Two of them got more than 2000+ likes in a short period of time, which is not bad.

  1. Product Manager: Can you Draw me a dragon out of div? 2627 great
  2. “Three kinds of front end to achieve VR panoramic housing scheme! May come in handy someday!” 2738 great

  • Essay classes should strive to be more systematic and in-depth.

I’m already writing a little book

  • Try out technical content in the video category.

I also published more than 20 technical video tutorials in the small broken station, with a total of 13W + playback. I haven’t found the g-spot yet, but I think I’ve got it.

  • Try live streaming of technical content, or even virtual hosting.

You’ve tried, but you’re done.

  • Strive to become a qualified lecturer

If you haven’t been fired, then you’ve passed.

  • Embrace open source

The 2021 submission record is a lot more than before, but not as good as many of the big guys.

2021 summary

How did I do it all? I seem to have done a lot more than that

  • Ape create polymerization assistant small procedures

A small program to help technical content creators gather nuggets, B station, there are many small tools to help sprout new procedures ape learning, open wechat search ape creation aggregation assistant to explore.

  • Programmer communication QQ group, wechat group

There are already four 2000 people

If you want to give 2021 a keyword, I think not confused is particularly appropriate

Even though I’m 40 years away…

But 2021 really figured something out once and for all

Based on data from three generations back

Men in my family usually die at 60

So the next 20 years (or maybe not so much)

What on earth am I going to do?

Flag 2022

  1. Can continue to fu

From now on, I want to use their own output to force their own input learning method, teach more partners, cultivate more gold harvesters. I learned Flash by myself in 2002 when I got my first computer, and iOS development by myself in 2008. I am now an all-stack all-end technical content creator. My experience will certainly help a lot of friends who love programming as much as I do.

  1. Q1 be sure to complete the booklet

Procrastination is really bad

  1. Say goodbye to full-time work

Although the rv trip I’m planning isn’t until my daughter finishes kindergarten, which is 2023. But I think IT’s time to start enjoying freelancing!

  1. Motorcycle license

Well, I applied for two rounds, but I failed course two. Change to three rounds, hope can pass ~

In addition, I will never change my goal to continue the stable and persistent output of technical content!

Thank you and be sure to comment on the raffle


This article is accompanied by a video of a small station