I made a TERMINAL website, with HIDDEN Easter eggs
HTML-код
- Опубликовано: 17 май 2022
- It's finally time I make a personal website, and nothing's cooler than a terminal website build with pure html, css, and javascript that contains a few little things about me. Oh, and some Easter eggs. This is not my final personal website. I'll be making something a bit more professional next month, but I always wanted to code a terminal website, so I took the opportunity to do so. Enjoy!
Terminal Website: fkcodes.com
------------------------
🐱🚀 GitHub: github.com/forrestknight
🎥 Twitch: / forrestknight
🐦 Twitter: / forrestpknight
📸 Instagram: / forrestpknight
📓 Learning Resources:
My Favorite Machine Learning Course: imp.i384100.net/YgYEBJ
Open Source Computer Science Degree: bit.ly/open-source-forrest
Python Open Source Computer Science Degree: bit.ly/python-open-source
Udacity to Learn Any Coding Skill: bit.ly/udacity-forrest
👨💻 My Coding Gear:
My NAS Server: amzn.to/3brqO7b
My Hard Drives: amzn.to/3aKetMi
My Main Monitor: amzn.to/3siQfPa
My Second Monitor: amzn.to/3keHT84
My Standing Desk: amzn.to/3boAcbC
My PC Build: bit.ly/my-coding-gear
My AI GPU: amzn.to/3uvmUmz
🔧Coding Tools:
The Best Linux Server Hosting: bit.ly/linode-forrest
Let me know what Easter eggs you find! This is NOT a responsive site, either. Desktop only... for now (and probably always).
Thanks to Rize for sponsoring today's video. Use my code FORRESTKNIGHT or link rize.io/forrestknight to be the first 1000 people to get a 25% discount off your first three months with Rize.
Found the password in console but the command does nothing for me
how do you use rise with linux?
website is awsome.
i found email
ya got me
I’ve been watching you for a while now and I have to say I absolutely love the passion and dedication you have for computer science and the tech field. I’m actually starting my first year in college for computer science! I will definitely have this terminal website as a side project ! Thanks for all the inspiration and great content.
I think the adjective you were looking for, for the colors was "muted", meaning they are slightly desaturated as opposed to a neon color for instance....great video, cool project!
found you a few days ago trying to get back into coding since I graduated college. I think this project was really awesome and I've been looking at your older content, I am starting my own project and think your material is really helpful.
this is really cool. I love the idea, and I might end up commandeering it for my own personal site
Go for it
I really liked the format and I loved seeing you try some JS, this makes me wanna try this project myself. You can definitely tell you're newer at JS 😂 but looking great still
I love the idea of the website. I kinda want to make my site like that now. And I liked the structure. Not a tutorial, and not an all out lecture. Totally more engaging and fun.
Haha. I knew it !That's the sound of inevitability.
I love the simplicity and creativity of your site. I think it has the potential to go even further. You could really have some fun with this - as you already have.
One thing I did feel it was lacking was a confirmation when opening links, or where the link was going. [Y/N] "Opening: External... Email client...". The email link specifically felt a bit abrupt, due to not knowing how the email was going to be handled. A terminal contact form could be fun...
Great little project though. ;)
That is SLICK. You've got me scratching my head figuring out how you get the text to "write" out to the screen one character at a time.
reallly like the structure of the video. you can go into more depth of the code coz that really excites me a lot personally. And the website is genuinely awesome
dude i totally subbed because of how fun you made this video, totally inspired me to steal your code and figure out how to incoporate this in my website. cheers!!!
This is beautiful. I was expecting though an actual console program, that's what I'm researching, I'll keep looking :) Thanks for the inspiration.
This video makes me want to do more work on my system terminal to get it more to my liking. Thanks for the inspiration.
Thanks Man, for a long time I've been thinking how I could build something like a shell web and now I got it thank by you so you have a new subscriber.
I like how you introduced your sponsor 😂.. super creative. Th video is quite immersive and well... helpful. Thanks.
I'm new to JS. I really like the style of the video and to see how a developer thinks. I would like to see more of the logical coding done.
I love the video! This is what I am looking for to add on my project to execute my code. Thanks so much! Cheers,
So I typed 'sudo', and learnt my lesson never to. Well played, Forrest.
I actually discovered the secret command before finding the password 😂 Awesome project, I've never seen a website in this style, but I really like it and I'm planning to build something similar myself. Keep up the good work.
what is it
@@JacksonMiller_ "sudo"
@@radoslavl921 its not working lol wtf (using msc edge)
@@radoslavl921 it is not "sudo"
Great video, loved a looot the website, and regarding feedback, I would like to see more coding stuff. Great work!
I like the structure of this video it more interactive where I have to pause to read the code, and go to your website to read the source. I hope you keep adding into your terminal style website, rather than considering it an in-between project.
I'm learning xtermjs 'cause I'd like to use the terminal-kit and other npm modules, but your approach might be quicker.
I am so glad I came across your channel great content, love your stories keep it up man! You're my inspiration 💛
This looks super cool! I sort of want to stop what I’m doing right now and make a terminal website too. 😅
All I'll say is that the secret is well worth finding
Good stuff as always! Your content really helped me find myself as a new Tech RUclipsr that switched careers to the tech industry recently. I'll keep watching your future videos!
Hi forrest! I love the website! There's a typo in the whois command, but that's fine. Fun project!
Cool, I love all the effects and styling. My only suggestions would be to possibly make it responsive. Change the input to non-case sensitive. Whoami didn’t show anything for me. One thing I really liked is that typing the video link titles brought me to the page. That was a very nice touch!!
This is so cool! Thanks for this!
At first I thought you meant a website actually designed to be accessed by a terminal browser on the user's machine.
As in, tailored to look best on their terminal, without caring how it looks in a browser.
But this is cool too.
I liked this. I'm gonna build my own. I wanted to have a toggle command to swap terminal styles between C64, DOS, Mac, my own style, etc and dynamically change out the CSS
The password got me lol. btw I like the new video idea, I see you more energetic. Keep it up Forrest
I don't have a personal website. But, this video definitely encourage me to develop mine :) Thanks dude.
Thats cool! Kinda reminds me of pre internet BBS (bulletin board system). You could dialup a phone number (via modem) and see a similar colorful "websites" in your terminal.
Personally I used to have a similar website like yours, geeky but depends on who your target audience is. Probably nothing for a potential customer who doesn't know wtf all this is about xD
I loved the video, me personally love code explanations maybe a fun over view
Darn that's probably the most useful sponsorship I have ever seen. Most are like buy 'cheap headphone brand'.
You should totally have the commands hosted in a JSON somewhere else so you can update the commands/output remotely. Super cool project though, nice easter egg ;)
It looks awesome! I like how you used vanilla javascript instead of React or another framework. And the amount of code on the video is fine. Too much and it becomes boring.
About the site itself: there's a typo on line 5 of your bio, in "documented". And the backspace is a little buggy.
And about the secret, I was not expecting that. lol
I am hoping not to get rick rolled while finding the secret. I also use arch btw
By the way forrestknight is using Windows and wsl2
I hadn't been rick-rolled for a while 😅
Classic arch user sentence
Ive wanted to make a site like this for so long. Just such a cool idea in my opinion. Because I am always using a Terminal. LGR had a similar website he might still, that's where I got the idea.
Whaaaat??
I was dreaming and got that idea... and now I see your video that I'm actually not the only one and a lot of people already did there.
Snap
This is a great video I was actually planning to make something like this. I am learning Vue now
Never give up looking for that password 😂😂😂😂 Great work Forrest!
great idea. never thought of a terminal website
Awesome project man!👍
Where can I get all the sourcecode in this video? I'm trying to make one.
This is awesome Forrest!
HA! I read through the source code and found where the secret command leads to, It was easy for me to recognize that link because I've been given up so many times, but this time, I haven't 😊
Found the secret and actually laughed out loud!! 🤣😂🤣 ... you got me Forrest!!
Love your idea, of a terminal in the web. Please can you make a website on terminal like links, does but terminal base...
But for the website ❤❤❤🎉
Hey dude, make a video on folder tree structure and clean architecture. It is really needed, not only me everyone needs to know that. Thank You in Advance.
The secret was amazing. I am curious if there's multiple passwords though.
Doesn’t seem to be looking through the code
@@superfluffygame it was so obvious in its placement that when I looked at it being statically typed.... I facepalmed. also Ctrl + f is your friend with looking through source code.
Hope you have a great day & Safe Travels!
@@TheSensationalMr.Science yeah but where is the source code i wanna fork it
@@tristanwait4itlegendary to access source code of the page (cause its merely hidden under a layer of obfuscation):
just right-click the page (anywhere) -> click view page source -> seeing page source.
[btw, click the " 'files'.*" files for more details to the source code... also there is httrack that is a great tool for downloading websites]
Hope you have a great day & Safe Travels!
@@TheSensationalMr.Science Thanks HTTrack was what i was looking for . i knew about F12
I really like this idea, is this a style of web portfolio you might recommend to a new web/software developer? I'm graduating very soon and trying to get my ducks in a row and want to have a nice clean and concise portfolio to be able to add to.
nice video man, you got my sub (:
I would love to know how to make this site start to finish, very cool!
I remember back in the day before 2010 when a lot of tutorials and clickbait videos on RUclips were just a music video from the 1980s.
Love the website, but how did you made the Ascii Art work? I tried it myself and it always ended up all messed up...
What theme do you use in VS-Code?
This totally inspired me. I want to write an emulator in javascript and see if I can boot Linux in a browser!!
Really fantastic!
that segway to the sponsor made me audibly laugh lol, good one
Is this a tutorial? i like the idea and i'm quite capable of looking at the source and pulling it apart to see how its done. But I think i'd like a bit more background. You did research at the beginning, more info there would be useful so I can go over the same resources and make decisions as to how I'd like my terminal website to look and act.
after watching this video i am build a terminal website also. It is not an easy thing to build . I dont know am i able to give a link to my terminal website . After build a terminal website, it is so satisfying to type in it. And also i add some funny js scripts to my terminal website
3:03 Wow.... that was smooth. xd
I have mixed feelings after finding the secret 😂🤣🤣
Well done.
Although, it would be better in 4K !!!!!!!!!!!
This is cool! Though I'd might like it even better if you made this with Telnet instead (or a dialup BBS)
Wow this is a gread idea! I'm gonna make my personal website a termsite too
EDIT: I have made interactive terminal simulators and I have a tip. It's a lot easier to create the commands as an object:
commands = {
name: (args) => {},
}
I love the Rize ads
I loooooooooooooooooove it!!!
I did not expect that secret command
hello bro, I want to make a site (initial and 4 more categories from those four categories, each has two more subcategories) and search. what do i need please start from the beginning (program, what files do i create, where do i write). if you have such videos please redirect and give me an answer. I want to learn but there is no one to explain it to me. thanks
Damnn totally loved the secret😂😂
what is this?
Anyone know his color pallette for his IDE because that looks amazing
That terminal is very very well made other than the responsive part
sir what theme do you use on vscode? if you don't mind
I figured out the password and got the sudo command. I just can't get it to work. Is it deliberate or it has work left to do?
Super cool!
Great Video,
I would Like more Code
pretty cool idea man, i really like it.
i suppose the interesting part is beyond the secret chamber.
can you give atleast some hints tho?
i checked out everything and nothing poped up, maybe cuz i dont know you well enough, lord knows.
That effing sudo command!
Now that was a Linus Tech Tips level of sponsor segment 😅
I can't find the source code in github, have you posted it there ??
Is top do you mind if I use it for may startup ?
Great Stuff , I like your videos and project
A simple note : Change help To SOS , Coz everyone is using help , SOS will give you some uniqueness
how did you make that output effect of typewrite? wow
what color theme are you usning?
$> echo "Terminal is life!"
Terminal is life!
Which theme is that on VS Code
Bug report (maybe): when i tried it on my phone i had to press enter twice for the command to run..
And the website is not responsive but that doesn't matter..
Yea, I didn't bother testing on mobile or making it responsive. More of a desktop experience. Thanks for letting me know, though!
Bruh, you fucked me up with the secret. How come????????? Good job, really amazing design.
so cool! It would have been great if it worked in a text browser
I just got rick-rolled, good job haha. I like the concept, really cool and entertaining.
onkeydown for up and down arrow needs to be changed to prevent the default behaviour because it allows users to type where the cursor is not
I personally would love to see more code...❤
Where can I get the source code ?
Found the secret, kudos FK 👏
I am struggling to recreate the caret to look like a terminal instead of the default text area. Any help?
Helpline📲📥⬆️
Questions can come in⬆️
Forrest:
"I'm probably the best JavaScript developer on RUclips."
Brendan Eich:
"Cool story, bro."
Eich was relevant like... 2 decades ago?
What about Web Dev Simplified?
This looks like a super fun project to try!
Literally sitting here waiting for something to compile xD
i liked the secret. one small problem tho, when you enter the command 'clear' the ASCII Art dissapears which is kinda sad in my opinion
just type in 'banner' and it will reappear ;)