#it's fun though you should learn html and javascript and css and such | Explore Tumblr posts and blogs

boyfhee · 1 year ago

Note

hmm, jay fic?? write it and you shall submit. i will be waiting for it, hehe. even i want to start a writing account for enha but i dont know what to post first T_T i have a text au and a headcanon, tell me which one should i post first :0

hope your bro does well in his 10th ✌🏼 tell him to not waste these next months, but hasnt the difficulty level for 10th graders decreased too?? i hate this education system. for us, 70% of syllabus was removed and people say you guys didn't write the exams 😭

hanuman chalisa haha, even if i have god by my side. i would be scared too. lmao how can a jaw chase her... noo that is so funny 😂 i mean i cant handle the smell of rotten food and what would i or you do with cadaver 🥲 i dont know. i regret everyday that why i havent chosen bipc 😔

i know apathorax from arjun reddy movie 😶 is it what it is?? help i dont even remember. isnt it beside the chest of a human?? the flesh part?? tell me tell me. well i havent been interested into coding but i need to start to learn how to code.

since you said you have coded, tell me the basic coding languages i need to know + how your teachers taught you caelin! i badly want tips to learn. like i have so many reels saved on my ig about coding + tips

same pinch, but i have been stanning them since on era and i think i was a hardcore fan until they dropped butter. i lost interest because same, their music started to change and started concentrating on the west. soo, i used to love the old bts caelin :(

hell no!!! when i used to watch yuzuru hanyu skating videos, i got into figure skating and then random videos used to pop up, even i used to know sunghoon before he debuted 🥲 i didnt watch like all of his performances but watched the best ones in his career ^^ he grew up so well.

yup!!! when fever was dropped, engenes knew it was a banger. damn it everyone on twitter asked whose song was this and engenes were like, huhu its enhypen \(^_^)/ hooray hahga. even i agree with you fever was and is the best bside i have ever heard from them.

this already long so i will continue in the next ask :3

— lover club anon <33

jay fic was posted, i hope it reached you well ^^ also, good luck with starting a writing account omg .. you can start with texts since they are a quick read and attract more audience !!! however, headcanons aren't bad either ... it really is your choice :O

i will tell him to do well in 10th, although he wastes all his time playing valo / forza horizon TT i don't know how easy or difficult the school exams have gotten, i've been so out of the loop ever since i graduated >< hope your sister does well too in boards ^_^

and omg bipc is fun but i'm sure pcm is just as interesting :O you have a fear of blood and needles so maybe you weren't meant for the OT but rather for doing other big things in like ... let's be positive !!! also, i think you mean apothorax ?? it's part of thorax containing heart and lungs ^^ i was studying about mediastinum today .. it's too much to take in. there's so much information and so little space in my brain .. sometimes i wonder if i will be able to remember all the things _ _;

also, i studied coding in highschool so i don't know how helpful my tips will be for college since you're definitely going to learn much much more there :O i think html css is basic and important ( for example, tumblr's who website theme and post format is based on html css ) javascript, python are important too since they're in demand. i'm afraid we didn't learn a lot in school except what was in theory .. didn't have many lab sessions and the most we did was python and html css since that was the main focus ( i hate python like whatever the hell that is ... )

i also started with hanyu !!! and then came across cha junhwan, yuna kim, ilia malinin and all though the international tournaments and all. i remember being so interested in fs, i watched the 4cc tournaments during classes TT i actually came across sunghoon through junhwan, watched his videos and then moved on like .. i didn't see him at the competitions so i thought he quit :O never looked him up for me to know he was a trainee / idol

AND YEAH fever is truly the queen, i can never get tired of it. border : carnival in itself is an amazing album. what's your fav album of them so far? fav b-side and title tracks? i need to know ><

#⠀ㅤㅤㅤ⠀ㅤㅤㅤsecrets & 𝒽er ฅ ฅ : lover club anon

0 notes

liliths-missing-pen · 2 years ago

Text

Idia With Yuu Who Wants To Learn How to Program Games

Not gonna lie this is a very self indulgent piece because my computer programming class is making me want to code but I also want to write 💀 This is my compromise here.

Notes/Warnings: Reader is Yuu, I am in the English server and wish to not know what happens in Book 6 till it comes out so artistic liberties will be taken. Also, Idia might seem a little ooc but when checking the wiki it says he gets excited and talkative when stuff he likes gets brought up so I took it and ran with it. Enjoy!

Masterlist

Before you came to Twisted Wonderland you already known how to code. Mostly just from camps that your family made you do or just out of general interest. Nonetheless you only knew the minimal to basic things, like HTML, CSS, a little bit of Javascript and Python as well C++. So to say the least there wasn’t that much you could do especially as a beginner. You’ve always seen video games or visual novels and wished you’d be able to do something like that one day but yet, you never got around to polishing skills or making yourself actually do anything to get yourself to that goal.

Jump skip to know that you are in Twisted Wonderland. You didn’t know much about this world at all, lots of things were different than your own world. The way things were done, school expectations, slang, magic. So to say, you just expected that anything you knew would be just thrown out the window one way or another. Once you met Idia though you felt more secure in your knowledge. Idia was someone who you can imagine to be the most normal in your world. He was one of those kids in your class at the back of the room, typically not speaking to anyone unless prompted. Now you may wonder, “How did the Ramshackle prefect become associated with the shut-in hermit?” Well like any other instance, Ortho.

Ortho was extremely persistent that once you expressed interest or made an off-handed comment that you knew some code and loved visual novel games, you should meet his brother. Honestly, the issue wasn’t to convince you, it was Idia that needed convincing.

Since it wasn't Idia who invited you to his dorm, he was flipping out when Ortho told him to expect you. He's heard about the notorious Ramshackle prefect who dealt with Overbolts even though they're magicless. He couldn't lie and say that he wasn't interested in you though. Not everyone was able to do that. He just wasn't sure if he could do this right now.

Once you did arrive, Ortho carried most of the conversation. Idia was trying his best to try to make conversation as well but he couldn't bring himself. It was hard to talk to a normie okay?!

Well, that's what he kept thinking after each of his failed attempts. Ortho knew what to do though, he knew his brother would have issues so he hacked into your Magicam account to learn more about you till he ran upon all the gaming and anime accounts you followed. He put to and to together and this was Ortho's plan to make you two talk normally. Once he mentioned a game he knew both you and Idia played it was the start of something great.

Idia's attitude towards you changed completely once you talked about video games and anything else he was into. Which dragged into how the game was coded and whatnot. Once you mentioned how you wanted to program your own game and your vision he was just like an over-excited child he ushered you over to his game, asking how much you knew about code and how fun it would be to create a game.

But basically, once he dragged you in it'll be very hard to leave. Your whole friendship with Idia from then on was built on the game y'all were creating together, anime and gaming. Not that you'd complain it was very to have Idia around. Just that you'd always have to start up the conversion since Idia will always second guess himself

Even once you two finish creating your game Idia would still keep you around. He'd even start being the one to invite you instead of just showing up! After helping you learn and sharpen your skills in programming by working on a game together, you'd start to help him out too! If you know anything about programming, especially C++ you know how picky it is with its writing. Whilst he's off typing quickly you start to point out to him certain things he's missing, like a semicolon on something that'll screw the whole code up.

Wholeheartedly once you make friends with Idiai from one of his special interests it's going to be hard to pull him away from you <3

#🐉 | lilith’s writing’s #idia shroud #twst idia #idia headcanons #idia x yuu #idia x y/n #idia fluff #twisted wonderland idia #idia x reader #idia hcs #idia drabble #idia #disney twisted wonderland #twisted wonderland

135 notes · View notes

detroit-grand-prix · 3 years ago

Text

if she wants me - susie wolff x female oc

part 1: things fall apart, i don’t know why we bother at all

Summary: Heartbreak drives you to do strange things.

Strange things like quit your perfectly-fine job, apply for a job in an industry you’re not familiar with, and move halfway across the world when you happen to somehow get through the interview process with a job offer. As if that’s not enough upheaval for one lifetime, you fall in love with, and start a relationship with your boss, a happily married woman. But it’s not cheating. Somehow.

Tags/warnings: First-person OC perspective, negotiated polyamory, fluff and smut, porn with plot, lesbian character, bisexual female character, boss/employee relationship, divorce (but not the Wolffs, don’t worry)

Author’s note: I posted this on AO3 originally, but orphaned it because I got embarrassed about it for some reason. I’m gradually crossposting my fanfics over here so I can build a master list, so this is going to be the first one. Standard RPF warnings apply, this is just all for fun and doesn’t reflect an actual relationship or scenario.

Heartbreak drives you to do strange things.

Strange things like quit your perfectly-fine job, apply for a job in an industry you’re not familiar with, and move halfway across the world when you happen to somehow get through the interview process and get offered the job. As if that’s not enough upheaval for one lifetime, you fall in love with, and start a relationship with your boss, a happily married woman. But it’s not cheating. Somehow.

Even now, a year after I got on a one-way flight from Detroit Metro Airport to Nice, France, with the sum total of my life packed into a few suitcases and boxes, I’m still not sure how I ended up here.

Maybe because of something Emily, my wife… well, my ex wife, told me when she told me she was leaving me. That she was bored with our lives, bored with me. That I was boring, that I was stuck in a rut and she couldn’t take it anymore. She told me I had no sense of adventure, that I was afraid of risks. I suppose these were reasonable critiques, but after so much chaos in my childhood and teenage years, I was fine with my boring life - at least it was stable.

I’d grown up in relative poverty in some backwater town in northern Michigan, and grew up with the fear of knowing I was different, and not the kind of different that was acceptable in my town or my family. I felt the way about girls that I was told I should feel about boys. It made me feel like I was apart from my peers. I told my parents, and they weren’t thrilled. They didn’t disown me or anything, but our relationship after that was never good.

I had an escape plan, though. Like any teenager in the early 2000’s, I spent a lot of time online. My family couldn’t afford a computer or internet service until well after I was in high school, so I’d sit in the school library for hours in middle school, learning how HTML, CSS, and JavaScript worked, building my own websites on GeoCities and LiveJournal. I loved it, and I loved writing code myself. I honed my skills and taught myself as much as I could through high school. I did well enough in school to get a full-ride scholarship to a relatively prestigious college, got my degree in computer science, and never looked back at my little old town again.

I finally came completely out as a lesbian in college, during my first year. After I graduated, I married the girl I’d been dating since my second year, landed a job right out of school as a systems analyst with a large university fairly close to where I’d gone for undergrad.

I worked my way up to a position that didn’t pay what most would consider massive fortune, but allowed my wife and me to live very comfortably in our moderately-sized university town. My wife worked in marketing for a company that made authentication software, so we really were doing quite well for ourselves. We managed to buy an adorable two-bedroom house in the city before the market started inflating, we each had a two-year lease on a nice car - (a Lexus for her and a Subaru for me, naturally), and two cats. We paid our bills, put away savings, and had enough money to travel. Neither of us had ever wanted children, which gave us the time to do mostly what we wanted. We went to Japan, the UK, Iceland, Morocco, France, Germany, and New Zealand. We took weekend trips to a rented cottage on Lake Michigan, and to Chicago to see plays or concerts. We could indulge our hobbies and take classes to find new ones.

I was happy. I’d found someone I loved, and who loved me. I had a job that I enjoyed and paid me enough where I didn’t have to worry about much. It was everything I’d dreamed of having as a kid.

It was different for Emily, though. She grew up in the Detroit suburbs, her parents were relatively well-off. Both worked white collar jobs in the automotive industry. She went to a private prep school, and then straight to the same small private college that a lot of her friends ended up (which is where we met), so I suppose I could see why she thought our life was staid, stale. While our life was everything I’d hoped to have and couldn’t ever imagine having while I was growing up, for her, it was just a continuation of how she’d grown up. We lived 45 minutes from her parents’ house. And her parents were accepting when she came out to them, so she didn’t even have the experience of teenage rebellion via disappointing her parents with her sexuality. I guess I understood that she felt like she was caged and this was her way of kicking her way out of it.

None of that made it any easier to swallow when I came home one day to see that she’d packed up her clothes and our cats and drove her Lexus out to Los Angeles. I begged and pleaded for her to come back, to talk to me, to consider the alternatives. We could sell the house and move somewhere else if she wanted to, we’d both be able to find jobs easily. We could take a year off and travel the world on our savings. She was steadfast in her resolve, though - something I hadn’t known is that she’d been talking to someone on Tinder for a few months already, and was moving to LA to move in with her. Our relationship had been over for months, even though she still let me hold her at night and told me how much she’d loved me. I felt like I’d been hollowed out.

In what felt like an instant, the ten-year chapter of my relationship and marriage had come to an end. We signed the divorce papers, split our assets. She begrudged me nothing, wanting a clean break more than anything. Apparently, I was nothing more than an uncomfortable reminder of some past she was running away from. I kept the house and my car, she kept the cats and her car, we split up the money in our checking, savings, and retirement accounts.

I tried to live my life as normal for a while, but the house was too quiet without her or the cats. I couldn’t bear to sleep in our bed any more. I spent most nights on the couch, and some in our guest bedroom. I tried to fill my free time with new activities to keep her out of my mind and to keep myself from having to spend too much time at home. I felt like a ghost haunting the house I shared with her. During the cold, dark Michigan winter, it nearly sapped my will to live.

I mentioned this to my friend from work - one of my department’s administrators, Lauren. She was probably my closest friend, almost a sister to me. We’d worked together for years. She volunteered me to get out of the house with her one night, and we were out at a bar near campus that was frequented by more grad students and faculty than undergraduates.

“Well, Emily decided she needed something new so -” I scowled at her. “I’m just saying! You deserve a change, too, Amelia. You’re miserable and I think you need a change of scenery. It can’t be easy to be in that house. Rent it out for a while or something, try living somewhere else for a bit that’s not, well, here . Travel around like you suggested to her, meet new people, see new places, get a job somewhere else… actually, now that I think about it -” She pulled out her phone.

“My aunt has a friend from home that she still keeps in touch with who runs some kind of company in Europe, and I saw she was looking for… some sort of systems analyst, I think.”, she mumbled, scrolling through a social media feed to find the posting.

“Your aunt is from Scotland, right? I don’t want to move to Scotland… too rainy.” I said. “I’ve been there, it’s nice. Not somewhere I’d want to live, though.”

“No, here it is - it looks like the company is in… Monaco, actually,” Lauren said, showing me the job posting on her phone.

“Rokit Venturi Racing, Formula E Team…?” I said, squinting at her phone’s screen across the table. “Laur, I don’t know anything about… whatever that is. What’s Formula E?”

Lauren shrugged. “Car racing, I guess, but with electric cars? I don’t know. Either way, even if you don’t know anything about cars or racing, you’re a damn good analyst with a lot of experience, lots of companies would kill to have someone like you. And you work with engineers all day, that’s not something everyone can do.”

“I don’t know, Laur. Plus… Monaco? It sounds nice, but I thought only like, millionaires lived there.”

“Well,” Lauren said, “I bet they pay pretty well, then! I’m sending you this posting, at least promise me you’ll take a look.

“Fine, I’ll look. But I probably won’t apply. I like my job, and you’d miss me.”

“I would, a lot,” Lauren said, “But you’ve been so miserable lately, it’s… well, you’re just not the same any more, and I’m worried about you.” She patted my arm. “And I’m straight, so it’s not like I can just date you instead.” That made me laugh.

“Okay, I’ll give it a shot. What’s the harm in sending in a resume, right?” I downed the rest of my Moscow mule. When I got home, I updated my resume, hammered out a quick cover letter, and submitted everything to the website Lauren had sent to me. I went to bed and promptly forgot all about it.

That was, until a month later when I had an email with the subject, “Request for Interview”. I was confused, not remembering applying for any jobs recently, until I opened the email and saw the neat black-and-white “Rokit Venturi Racing” logo on the header. The email was mostly a boilerplate interview request, “we think your skill set may be a match and would like to schedule a phone call”, with available times to select. They were all absurdly early in my time zone, but then I remembered that this company was in Monaco , of all places.

I tried to imagine myself in Monaco. I was a midwestern almost-hayseed lesbian whose wardrobe was… well, practical, shall we say - I mostly wore jeans and button-down shirts, hoodies, and flannel shirts (of course). I didn’t consider myself butch, but I definitely didn’t get dressed up very much. One of the perks of my job was that I rarely, if ever, had to dress in “business casual”. My most expensive item of clothing was a Patagonia fleece that I’d bought almost a decade ago. Imagining myself amongst the designer-clad, sunkissed populace of the French Riviera was surely the makings of a fish out of water comedy movie. I signed up for a slot anyway - 8am eastern, 2pm Monaco time, a week from that day.

I looked at the company a little. It seemed to be a small operation. I didn’t know anything about racing, or what I would be doing with a race team, but if I wasn’t a good fit, it wasn’t a big deal. It wasn’t my dream job, and I didn’t need a new job. I was mostly curious.

The interview was with the team’s HR representative, Sophie. She was nice enough. She had a lovely French accent. I told her that I spoke a bit of French, we made some very stilted small talk in French, which seemed to amuse her for some reason. We talked about my work at the University, what kind of software I worked with - my job was specifically working with engineering researchers, so I worked with a lot of unusual systems and software. She asked if I had any experience with racing or motorsports, I was honest and said no, and figured that would be the end of the process. But, she noted that it wasn’t that big of a deal, as I had a lot of experience and have used and can support software their team relied on, and was used to working with engineers. She told me she’d get in touch to set up a next round interview with the team principal (“Whatever that is”, I thought) and the company’s CEO. “It will be over Zoom since you’re overseas. Normally, this would be the in-person interview.”

She set it up for the following Monday. I resolved to not do much research on the company. Though I’d worked for the university for years - since I graduated, almost, I’d watched Emily over-prepare for job interviews before and get herself worked up to the point of near-hysterics trying to learn everything she could about companies to give herself an edge. I don’t think it ever actually worked. I looked up the barest of essentials just so I didn’t appear completely clueless. I looked up what Formula E was, what a team principal was. I got the Zoom invitation and saw that the two people I’d be meeting with were named Susie Wolff and Jérôme d'Ambrosio, but that was it. I noticed the one named Susie was listed as the CEO, which did strike me as a little interesting, but I didn’t give it much more thought.

I’ve done Zoom interviews before, on the other side, interviewing people for our department during the height of the pandemic. It’s a universally awkward experience. I always dreaded the moment before the call starts when cameras and audio are still connecting and nothing appears in sync. I joined the meeting at the appointed time and waited, as I was the first to join. The next participant joined - the camera was blurry for a moment, but I heard a woman’s voice.

As the resolution on her camera corrected itself, my heart skipped a beat. She was the most beautiful woman I have ever seen. She was petite, with a blonde bob with sideswept bangs that sat just above her shoulders, eyes that looked like a warm hazel-green from the other side of the webcam, and a gorgeous smile. Her makeup, if she was wearing any, was perfectly done, her eyebrows were immaculate. She was wearing a pair of gorgeous pearl earrings, and a white designer top that made her look almost angelic. “Hello! Can you hear me?” she said, and I was suddenly feeling very dumbstruck and nervous. Now I had to get this job. “Hello! Yes! I can hear you!”, I said. “Can you hear me?” She had a Scots accent with just a hint of some other accent I couldn’t place that softened and lengthened the vowels, and I decided that I wanted to listen to her talk all day.

She introduced herself as Susie Wolff, the CEO of Rokit Venturi Racing, and said that the team principal would be joining us momentarily. We made small talk, and it only felt awkward because I was suddenly very nervous about this interview. She had kind eyes and an easy smile, and looked like she was genuinely interested in whatever I had to say, even if she wasn’t. She asked me about Michigan, and the weather, and I did my best to not giggle every time she asked me a question. I felt like a teenage girl again.

Thankfully, Jérôme came on the call a moment later and we started the interview after some introductions. I learned that Jérôme was a racing driver in Formula E previously, and Susie used to be a racing driver herself. “That’s amazing,” I said, earnestly impressed.

“I had no idea, I’m sorry. I haven’t watched much racing since I was a kid. It must have been tough, I imagine there weren’t many other women.”

She smiled at me, and said “Well, I’m sure you know what that’s like - I imagine there aren’t many female systems analysts out there.” I blushed a bit, and chuckled.

“That’s true. I was the only woman in my current department for a long time, and the only female computer science major in my class in college. When I was in school I used to say that dating in the computer science department meant that the odds were good , but the goods were odd .” That joke was well-worn, but both Susie and Jérôme laughed at it. I felt a little more relaxed.

The rest of the interview went very well, I thought, but I wasn’t expecting much, given that I was not familiar with the industry. I mentioned it, but Jérôme assured me that the fact that I’d worked with some of the software they were using and was experienced with hardware and networks was more important - “You can learn the industry easily enough, but it’s harder to teach someone how to use the software we use, even if they are good with the hardware and networking side.” We talked about her philosophies and goals for the team, and I was blown away everything she was saying. The accent certainly didn't hurt.

Once the interview ended, and they assured me they would get back to me, either way. I left the Zoom call and needed to take a few deep breaths.

Almost reflexively, I opened up a new Chrome tab and typed “susie wolff”, pulling up a long list of search results. I clicked on her Wikipedia page, and noticed right away that she was married, which made my heart sink a bit. I generally tend to assume most women don’t like other women anyway, but it preempted the fantasies that were forming in my head about her. I wasn’t surprised, though - why wouldn’t this outrageously beautiful, intelligent, and successful woman be married already? I clicked on her husband’s name - “Toto? Oh, short for… Torger? Okay.” - and saw that he was a dashing man, the very definition of “tall, dark, and handsome”. There were very few men on this planet that I would consider attractive because I was a lesbian, but I wasn’t blind. He was from Austria, and he also had an accent that was oddly endearing. I read that he had made his career as an investor, and was the CEO of the Mercedes Formula 1 team, in addition to being the team principal. They were perfect for each other, like some sort of motorsport power couple. Maybe I should have watched that Netflix show about Formula 1 my coworkers were always talking about.

I lost what felt like hours looking up everything I could about Susie - about her days racing German touring cars, her stint as a reserve and development driver for a Formula 1 team, old interviews in the UK edition of Vogue and some British newspaper, videos of her and her husband giving interviews together. He seemed like a perfect gentleman. He had a good sense of humor, and it was obvious they were madly in love with each other. They even had a son together, who seemed like a very sweet boy. Even from YouTube videos and interviews, I’d never seen two people who seemed like they were more meant for each other. Toto looked at his wife like she hung the moon and stars, just for him, which made me remember that Emily used to look at me like that. I used to look at her like that.

I even dreamed about Susie that night, about the way she looked when she laughed at my joke, the way she smiled at me during our interview, about those hazel eyes, gorgeous even through a low-quality Zoom video. It made me feel a bit strange, though - I’d only met the woman on a Zoom call, but I already couldn’t take my mind off of her. But, It was nice to feel something other than what I’d been feeling for months - bereft of warmth, love, happiness - all of that had left me in a silver Lexus SUV bound for the west coast. Plus, I reasoned, if I get this job, at least I’ll be able to work for this woman. It might set me up for the heartbreak of constant yearning later, but for now, I’d kill to have her as my boss.

Next Chapter

#crossposting from AO3 #susie wolff x f!oc #susie wolff fic #f1 fanfiction #fe fanfiction #formula 1 fanfic #toto wolff fic #formula 1 rpf #my fanfic #series: if she wants me

19 notes · View notes

queenlua · 4 years ago

Note

hey, i started following you recently and ur bio says ur a hacker? any tips on where to start? hacking seems like a v cool/fun way to learn more abt coding and cybersecurity/infrastructure and i'd like to explore it but there's so much on the internet and like, i'm not trying to get into anything illegal. thanks!

huh, an interesting question, ty!

i can give more tailored advice if you hit me up on chat with more specifics on your background/interests.

given what you've written here, though, i'll just assume you don't have any immediate professional aspirations (e.g. you just want to learn some things, and you aren't necessarily trying to get A Cyber Security Job TM within the next three months or w/e), and that you don't know much about any specific programming/computering domain yet.

(stuff under cut because long)

first i'd probably just try to pick some interesting problem that you think you can solve with tech. this doesn't need to be a "hacking" project at first; i was just messing around with computers for ages before i did anything involving security/exploitation.

if you don't already know how to program, you should ideally pick a problem you can solve via programming. for instance: i learned a lot back in the 2000s, when play-by-post forum RPGs were in vogue. see, i'd already been messing around, building my own personal sites, first just with HTML & CSS, and later on with Javascript and PHP. and i knew the forum software everyone used (InvisionPowerBoard) was written in PHP. so when one of the admins at my RPG complained that they'd like the ability to set multiple profile pictures, i was like, "hey i'm good at programming, want me to create a mod to do that," and then i just... did. so then they asked me to program more features, and i got all the sexy nerd cred for being Forum Mod Queen, and it was a good time, i learned a lot.

(i also got to be the person who was frantically IMed at 2am because wtf the forum is down and there's an inscrutable error, what do??? basically sysadmining! also, much less sexy! still, i learned a lot!)

the key thing is that it's gotta be a problem that's interesting to you: as much as i love making dorky sites in PHP, half the fun was seeing other people using my stuff, and i think the era of forum-based RPGs has passed. but maybe you can apply some programming talents to something that you are interested in—maybe you want to make a silly Chrome extension to make people laugh, a la Cloud to Butt, or maybe you'd like to make a program that converts pixel art into cross-stitching patterns, maybe you want to just make a cool adventure game on those annoying graphing calculators they make you use in class, or make a script for some online game you play, or make something silly with Arduino (i once made a trash can that rolled toward me when i clapped my hands; it was fun, and way easier than you'd think!), whatever.

i know a lot of hacker-types who got their start doing ROM hacking for video games—replacing the character art or animations or whatever in old NES games. that's probably more relevant than the PHP websites, at least, and is probably a solid place to get started; in my experience those communities tend to be reasonably friendly to questions. pick a small thing you want to do & ask how to do it.

also, a somewhat unconventional path, but—once i knew how to program a bit of Python, i started doing goofy junk, like, "hey can i implemented NamedTuple from scratch,” which tends to lead to Python metaprogramming, which leads to surprising shit like "oh, stack frames are literally just Python objects and you can manually edit them in the interpreter to do deliberately horrendous/silly things, my god this language allows too much reflection and i'm having too much fun"... since Python is a lot of folks' first language these days, i thought i'd point that out, since i think this is a pretty accessible start to thinking about How Programs Actually Work under the hood. allison kaptur has some specific recommendations on how to poke around, if you wanna go that route.

it's reasonably likely you'll end up doing something "hackery" in the natural course of just working on stuff. for instance, while i was working on the IPB forum software mods, i became distressed to learn that everyone was using an INSECURE version of the software! no one was patching their shit!! i yelled at the admins about it, and they were like "well we haven't been hacked yet so it's not a problem," so i uh, decided to demonstrate a proof of concept? i downloaded some sketchy perl script, kicked it until it worked, logged in as the admins, and shitposted a bit before i logged out, y'know, to prove my point.

(they responded by banning me for two weeks, and did not patch their software. which, y'know, rip to them; they got hacked by an unrelated Turkish group two months later, and those dudes just straight-up deleted the whole website. i was a merciful god by comparison!)

anyway, even though downloading a perl script and just pointing it at a website isn't really "hacking" (it's the literal definition of script kiddie, heh)—the point is i was just experimenting a lot and trying a lot of stuff, which meant i was getting comfortable with thinking of software as not just some immutable relic, but something you can touch and prod in unexpected ways.

this dovetails into the next thing, which is like, just learn a lot of stuff. a boring conventional computer science degree will teach you a lot (provided you take it seriously and actually try to learn shit); alternatively, just taking the same classes as a boring conventional computer science degree, via edX or whatever free online thingy, will also teach you a lot. ("contributing to open source" also teaches you a lot but... hngh... is a whole can of worms; send a follow-up ask if you want that rant.)

here's where i should note that "hacking" is an impossibly broad category: the kind of person who knows how to fuck with website authentication tokens is very different than someone who writes a fuzzer, who is often quite different than someone who looks at the bug a fuzzer produces and actually writes a program that can exploit that bug... so what you focus on depends on what you're interested in. i imagine classes with names like "compilers," "operating systems," and "networking" will teach you a lot. but, like, idk, all knowledge is god-breathed and good for teaching. hell, i hear some universities these days have actual computer security classes? that's probably a good thing to look at, just to get a sense of what's out there, if you already know how to program.

also be comfortable with not knowing everything, but also, learn as you go. the bulk of my security knowledge came when i got kinda airdropped into a work team that basically hired me entirely on "potential" (lmao), and uh, prior to joining i only had the faintest idea what a hypervisor was? or the whole protection ring concept? or ioctls or sandboxing or threat models or, fuck, anything? i mostly just pestered people with like 800 questions and slowly built up a knowledge base, and remember being surprised & delighted when i went to a security conference a year later and could follow most of the talks, and when i wound up at a bar with a guy on the xbox security team and we compared our security models a bunch, and so on. there wasn't a magic moment when i "got it", i was just like, "okay huh this dude says he found a ring-0 exploit... what does that mean... okay i think i got that... why is that a big deal though... better ask somebody.." (also: reading an occasional dead tree book is a good idea. i owe my firstborn to Robert Love's Linux Kernel Development, as outdated as it is, and also O'Reilly's kookaburra book gave me a great overview of web programming back in the day, etc. you can learn a lot by just clicking around random blogs, but you’ll often end up with a lot of random little facts and no good mental scaffolding for holding it together; often, a decent book will give you that scaffolding.)

(also, it's pretty useful if you can find a knowledgable someone to pepper with random questions as you go. finding someone who will actively mentor you is tricky, but most working computery folks are happy to tell you things like "what you're doing is actually impossible, here's why," or "here's a tutorial someone told me was good for learning how to write a linux kernel module," or "here's my vague understanding of this concept you know nothing about," or "here's how you automate something to click on a link on a webpage," which tends to be handier than just google on its own.)

if you're reading this and you're like "ok cool but where's the part where i'm handed a computer and i gotta break in while going all hacker typer”—that's not the bulk of the work, alas! like, for sure, we do have fun pranking each other by trying dumb ways of stealing each other's passwords or whatever (once i stuck a keylogger in a dude's keyboard, fun times). but a lot of my security jobs have involved stuff like, "stare at this disassembly a long fuckin' time to figure out how the program pointer got all fucked up," or, "write a fuzzer that feeds a lot of randomized input to some C++ program, watch the program crash because C++ is a horrible language for writing software, go fix all the bugs," or "think Really Hard TM about all the settings and doohickeys this OS/GPU/whatever has, think about all the awful things someone could do with it, threat model and sandbox accordingly." occasionally i have done cool proof-of-concept hacks but honestly writing exploits can kinda be tedious, lol, so like, i'm only doing that if it's the only way i can get people to believe that Yes This Is Actually A Problem, Fix Your Code

"lua that's cool and all but i wanted, like, actual links and recommendations and stuff" okay, fair. here's some ideas:

microcorruption: very fun embedded security CTF; teaches you everything you need to know as you're doing it.

cryptopals crypto challenges: very fun little programming exercises that teach you a lot of fundamental cryptography concepts as you're going along! you can do these even as a bit of a n00b; i did them in Python for the lulz

the binary bomb lab is hilariously copied by, like, so many CS programs, lol, but for good reason. it's accessible and fun and is the first time most people get to feel like a real hacker! (requires you know a bit of C beforehand)

ctftime is a good way to see when new CTFs ("capture the flag"s; security-focused competitions) are coming up. or, sometimes CTFs post their source code, so you can continue trying them after the CTF is over. i liked Stripe's CTFs when they were going, because they focused on "web stuff", and "web stuff" was all i really knew at the time. if you're more interested in staring at disassembly, there's CTFs focused on that sort of thing too.

azeria has good ARM assembly & exploitation tutorials

also, like, lots of good talks out there; just watching defcon/cansecwest/etc talks until something piques your interest is very fun. i'd die on a battlefield for any of Christopher Domas's talks, but he assumes a lot of specific x86/OS knowledge, lol, so maybe don’t start with that. oh, Julia Evans's blog is honestly probably pretty good for just learning a lot of stuff and really beginner-friendly?

oh and wrt legality... idk, i haven't addressed it here since it hasn't come up in my own work much, tbh. if you're just getting started you're kind of unlikely to Break The Law without, y'know, realizing maybe you're doing something a bit gray-area? and you can cross that bridge when you come to it? Real Hacking TM is way more of a pain-in-the-ass than doing CTFs and such, and you'll learn way more with the latter, so who cares lol just do the fun thing

21 notes · View notes

jamiesmcstuff · 5 years ago

Text

Web Authoring Blog

10/01/21

The past week I have been working on my assignment through Wordpress. The assignment is to install and build our own wordpress site on the college server. This was a basic enough assignment but I did encounter some problems along the way. Firstly, I had a problem connecting to the college server, which meant I was required to get a new password from IT, and that took up some time.Once I could connect to the server I successfully connected to the server, and uploaded wordpress to filezilla.

I also encountered a problem trying to activate a child theme on my wordpress site. I didn’t realise that my .css file in my wordpress folder had an extra full stop where it shouldn’t have been, and it was breaking my up the code when I tried to activate my child theme on the wordpress site. Once I figured this out (which took some time) I found that I had a lot of fun with this assignment.

It was great to play around with all the various features of wordpress. Somethings I did find a little strange and a bit unintuitive (such as accessing certain editing functions from the front end site) but I I got used to the workflow the more time I spent on it. I do feel like I ran out of time and had to eventually settle with what I had for the assignment but I am keen to continue working on the site I had created in order to improve my skills using Wordpress, and having something good to add to my portfolio.

22/12/20

Last week we covered CMS systems and. It seems like it should be straight forward, however if I have learned anything so far its that sometimes coding can seem straightforward, but due to lack of experience simple problems can be difficult to figure. Wordpress, however, looks great a a system to use.

As soon as we started learning it I could think of difficult examples of blogs and websites that have used Wordpress as a platform to great effect, and I am excited to start using the platform properly. It seems that once you start using Wordpress, and get used to the workflow, you can create really great looking websites with minimal effort.

There are so many different customizations meaning you can be very creative with Wordpress. I am excited to start using some other CMS systems in order to see how they compare against Wordpress anf figure out whether Wordpress is the best option for me as a system to use going forward.

16/12/20

This was our first week covering Wordpress and CMS systems. I had heard from multiple sources regarding the unintuitiveness of WordPress but that definitely was not my initial thought. It potentially could have been outdated by other CMS that came after it, but as a platform it seems very powerful if you know how to use it correctly.

My mind automatically started thinking ahead in terms of how platforms like wordpress could be used by web designers, and myself hopefully when the time comes, to build comprehensive and sophisticated web pages for clients.

We had a reading week so had no class on the 12th of December, but on the 11th we also had to submit assignment 2, which was our personal profile web page. It was a tough task, but I believe I got a good result for my first attempt at creating a web page. One problem I encountered, that I was very satisfied to find a solution for, was aligning an image of the Griffith college logo to the right of the footer. After numerous attempts at finding a solution ( and tearing out a lot of hair) I eventually entered a <p> into the footer and cleared the floats within the style sheet which aligned the image up correctly.

2/12/20

Last week’s lecture covered Flex boxes. I think it may have been the first time we were exposed to any kind of framework that can simplify the building of web pages to some degree. From what I understand, tasks pertaining to the layout of elements on a page can be strenuous in terms of writing the html and css code; but flex boxes are effective in streamlining this process through their own unique set of rules.

I found Flex boxes easy to understand because, to the best of my knowledge, flexbox follows similar cascading and hierarchical principles as are the fundamentals in other parts of coding we have learned. For example, the container is a parent and everything contained within (items) are children; akin to how a <section> element is a parent to a child <p> element contained within that section. I am starting to see how coding language is very complicated, but is designed to try and be as user friendly as is possible; there is a consistent way to think structurally about code that will benefit me and help me to troubleshoot problems I may have down the line.

25/11/20

Last week's lecture we covered color, links, layouts and floats. There was pats that seemed to be as straightforward as our previous lecture, and I found myself easily able to keep up in terms of what we were learning. For example with color, it was easy for me to understand how color can be applied to different elements. Also, I like how there are different ways that things can be applied through CSS, for example there being a choice to apply colour by percentage, or by hex values.

However, there I had two main takeaways from this class. The first, which I was already aware of but hadn’t yet been covered in class, is that CSS isn't just about visuals, parts of the page can be laid out in various ways by applying different rules. Floats do seem complicated, but once I get some experience using them I know it’ll be a massive part of building web pages, so it's something I am eager to get practice in.

The second take away, which I hadn’t pre-empted as a possibility with CSS, is the 5 styles that are applied to links on a web page. This was very interesting, and I was surprised, because I had thought that Javascript was the coding language for integrating interactivity on a web page. However, pertaining to our upcoming assignments, it is somewhat of a relief to know that more basic functions such as the 5 styles for links can be applied through CSS, without having to yet know javascript.

18/11/20

Last Saturday we had our first lecture that introduced CSS. A few things we covered were rules, IDs, classes and the cascading specificity of CSS. From the first introduction it seems to be straight forward enough, however once applied into a practical context I am sure there will be a lot of barriers to overcome in order to get competent with CSS. Seeing the difference between how a basic html page looks, without CSS, and then the possibilities once CSS has been applied was exciting.

I have found html relatively easy thus far, and it is very satisfying once the code does what you intended. However, it doesn't make things look beautiful, so seeing the difference between a page with and without CSS, and what the possibilities can be, was very exciting. Gemma used the example of the Griffith website, with and without the CSS, and the reality of what's possible once I get to using CSS became a reality.

SImilar to writing html, and the application of good practice and bad practice in terms of writing code ; we learned in last week's lecture the difference between inline CSS and stylesheets, and how the latter is the preferred method of applying CSS. Even though it would seem easier to write CSS within the same file as html, I am very conscious now of ensuring that I do not fall into bad habits in terms of I write any coding language as I hope to day be hired based on the quality of the work that I provide, so will avoid developing bad habits at any cost.

10/11/20

Last Saturday 7th November lecture covered semantic html and the structure of web pages. The previous lecture on links, images and tables had demonstrated and actualized for me the building blocks that web developers use across the board for different features of websites. Our most recent lecture built upon that knowledge and made me understand how semantic html is used to break up the different parts/sections of a website so that browsers can digest it and for SEO.

When practicing at home writing the code for articles and sections, which as I understand act as mini web pages within a web page,the muscle memory of writing code is improving physically writing code while also ingraining in me the concept of nesting code, and how hierarchy within that nested code is structured. The analogy of the Russian dolls has been mentioned numerous times and this week it became more applicable than before as a way to look at how you wrap up your code into structured pieces.

The easiest way for me to visualise semantic html in action was looking at online newspapers. Through looking at a few examples I could see how the home pages in particular are structured because they have so much content and articles etc that are irrelevant to each other. It's necessary to use semantic html to give meaning to each bit of content in order to direct internet users to relevant parts of the web page. One thing I never preempted, again in my own naivety/ignorance, was how integrated SEO is with the information contained within html. As a side project I think I will go and read up some more about digital marketing.

We were also required to do some practical exercise on forms this week. One thing of note, I had seen in previous lectures how values can indicate what happens when a user clicks on a link (opening in a new tab etc). Relative to values such as input/emails it’s interesting to see how these values can indicate how a specific entry of information into a data field, such as an email address, is handled. Also, the content we covered briefly touched on empty elements which I was not expecting as they don't follow the same rule set we had previously learned. I had expected there to be some as there are exceptions to rules in any language and html is no different evidently.

03/11/20

Our most recent lecture covered the topics of tables, links, images. As I mentioned in my previous post I was initially happy to be able to keep up with the material and didn't feel too far out of my depth. This week I am happy to say that I am still feeling positive about the decision to move into this new world and potential change of career.

With just two weeks under my belt I could already feel a change in how I will view websites going forward. As a user I had always thought, naively, of websites as eclectic; their features and functions presented as specific to the brand or organisation that they represent. However, during this lab, and particularly regarding the topic of tables, I began to visualize how they are all the same components put together by developers in different ways that serve the same functions.

Telecommunication companies websites and how they present their pricing online was one such feature that came to mind. Previously I would have thought that their pricing was just an image integrated within the web page but now I obviously understand that it is built through a specific <table> element that is adjustable by a front end developer.

I had a thought on the topic of images and their applicability in different parts of a web page also. Having worked as an outbound salesman for the last couple of years I looked at a lot of websites to find clients. Obviously, a company's budget has to be considered when considering the quality of a website but from what I observed there are some elements of websites that are perhaps ignored or rushed by developers, are not budget dependent, and can give a website a cheaper or less professional look.

I think the two screenshots below corroborate my point above; B2Bs logo on the home page of their site is slightly pix-elated while Hunt Office’s (one of the biggest office supplies companies in Ireland) logo looks smooth and gives it a cleaner look, which as the first thing a user sees when clicking onto a home page immediately portrays a better level of professionalism than that of B2B.

I am trying not to think too far ahead in terms of the end goal of being in this course, and this module, because I have a long way to go and an extremely vast discipline to cover before any of that will happen. Thinking too far ahead would be daunting for me so its better to sit back and enjoy the process of learning each part as it comes.

27/10/20

This web authoring module is the reason I decided to do this interactive digital media course. I have come from working in sales the last couple of years and wanted to make a complete career change. For that reason it was very important I acquired proper tangible skills that allowed me to make that change and I felt coding was up there with the best of options.

Our first lecture last Saturday was about HTML. From what I understand, we are learning HTML at the best time up to date as its been consolidated into one format that everyone in the western world abides by and is uniform so a lot of complications can be avoided across the board for developers and users alike.

The lecture primarily focused on elements and I was happy, and relieved, that I could keep up with the material and didn’t get too lost as this is all totally new territory for me. I enjoyed the lecture thoroughly as HTML seems logical and if you follow the right steps it does what you want it to do. I am looking forward to starting practice, getting the muscle memory working and moving toward that career change I need.

1 note · View note

soallearning · 3 years ago

Text

How Much JavaScript do you need to know to use NodeJs?

When you are new to Full stack development, you wonder about the time frame required to learn NodeJS and build a website, chat, or SaaS. A few might also think about the skill sets needed to get placed in a job. So, here are ideas to tell you how to become a full-stack developer using Node JS and how long it takes to become one.

It takes a few days to learn the basics. Learning Node JS and becoming a functional full stack application might take three months. However, you need to have other programming knowledge to get this done. Your current skill sets and your competency to learn new things can only determine the exact time required for understanding the new course.

Getting started to learn Node JS

If you are good at fundamental programming like HTML and CSS, you can get started with Node JS. But, you need to learn JavaScript skills as Node.js is a server-side technology that uses a JavaScript runtime environment at the backend. So, learn JavaScript while also learning Backend development. Moreover, if you are learning Node JS, go ahead with learning JavaScript if you have no experience. While building servers with Node, clear the fundamentals of JavaScript side by side as various concepts of JS will help you when you are working with Node JS.

This explanation about various skillsets will help you know how long it would take to get started with Node JS while you already know the basic programming. Also, if you are working somewhere, you should consider how many learning hours you can devote or give maximum effort to learn Node JS. For example, if you take a paid course and learn it by sitting before your computer, watching videos, learning, and writing codes throughout the day, you can complete the course in three months. Of course, it is not recommended to learn this rigorously. The course hour was just 10 hours. But to understand the concepts thoroughly, implement them, and redo them takes a lot of time. Of course, you can also skip learning the entire course. Instead, please take a few parts that interest you and do them. You can later mix and match the remaining portion of courses.

Though you might find it strenuous initially, it will pay you in the long run. Choosing the best online learning site is the key to becoming successful. For better understanding consider learning from top edtech universities like SOAL http://www.soal.io, which is an online university that offers top career-building courses for the new age professionals. SOAL which has a Pay after placement option not only helps you to get proficient in your skills but also helps you to get employed in the leading companies.

If you want to start up a business, it will help you connect with like-minded people to collaborate and share ideas and work mantras. This is a NEW AGE learning where you can interact and make lifelong connections.

What can you do with Node JS?

Node can be used for building applications and software that require real-time interaction, like chat websites and apps. For example, you can build a product listing site. You can integrate user registration, login, and posting user-generated content. If you are inclined toward social media, you can get started with Twitter Clone, and it will surely be fun. To prove your expertise, you can use the Free Heroku platform. After that, APIs, Reddit clone, and many other client projects can also follow suit. If you can share the work on the internet, there are possibilities of getting many job opportunities.

Making Node JS Efficient!

A few points are shared here to make your NodeJS learning process efficient.is an ocean, and even with years of learning, you might feel that you haven't learned enough and that there is a lot more to look into. The key is to pick a part of Node JS and become an expert. Then, if your goal is to build social networks, you can go with the full stack application. Express JS helps you to build Node Server in a faster manner.

Express JS is the most accessible and most popular framework for Node JS. A few lines of coding will let you run a server. However, it would help if you had custom NPM modules for anything and everything when working with Node JS. Express JS is a custom module and using the methods provided by the application; you can install it.

You can create controllers, routes, and view engines differently with Express JS. The built-in configuration will run the server up in a less cumbersome manner. A project with boilerplate code too can be started with this framework. Different HTTPS methods should be handled effectively, which is required for creating routes.

Master the Basic HTTPS Methods!

The front end of the application interacts with the users. For instance, the front end will respond to the server when you post a tweet. Then the server responds to post it on the web application. The Create Read Update and Delete operations, CRUD in short, are taken care of by the backend. It is enough that you know the basics about these and should not end up memorizing these things.

You need to understand that the process is all about setting various configuration files. The NPM modules are of different categories and have multiple configurations. So, begin with your goal setting, and find from Google the suitable module for the task. Find their documentation and watch videos. Test and work, and repeat the process.

Final Words.

The key when you are learning Node JS is to practice a lot. You should know and find how far you can take it. Level up with practice as soon as you remember. You can try building new projects from the core every day, and it will also give you an idea about your understanding. It would help if you tried small portfolios to stay committed. When you are done, do not hide your work with you. Showcase to the world. This is the way by which you will get new opportunities. Within three months, you can learn Node JS this way and keep building new projects. After mastering Node.js basic features of Node.js, you can try Express.js. You will surely enjoy that too!

#html_css #css #java

0 notes

sagihihi · 4 years ago

Text

10. BEST PROGRAMMING LANGUAGE TO LEARN FIRST?

Knowing that I'm learning coding in Griffith college, one of my friends asked me if she wanted to learn coding from the scratch, which programming language she should learn first. At that time, I paused for seconds before giving her my answers. I ended up saying that HTML and Javascript. The reason why I said the two languages was because they were what I was taught at school. I didn't know why I learned the two languages. It's probably that these are two basic and simple coding languages for those who just started programming. I believe that whether you’re looking to begin coding as a hobby, or just to enhance your current role, the first thing you’ll have to do is decide which programming language you want to start with. I think there is no absolute answer for it. Choosing a first language will depend on what kind of projects people want to work on, who they want to work for, or how easy they want it to be. Some recommended programming languages are:

Python: Python is always recommended if you’re looking for an easy and even fun programming language to learn first. It allows you to obtain a basic knowledge of coding practices without having to obsess over smaller details that are often important in other languages. Python also is ideal for web development, graphic user interfaces, and software development. In fact, it was used to build Instagram, Youtube, and Spotify. Though it has it’s advantages, Python is often thought of as a slow language that requires more testing and is not as practical for developing mobile apps as other languages.

C#: While C is one of the more difficult languages to learn, it’s still an excellent first language pick up because almost all programming languages are implemented in it. This means that once you learn C, it’ll be simple to learn more languages like C++ and C# Because C is more “machine-level”, learning it is great for teaching you how a computer functions. C is an exceptional choice to become a master coder and a talented developer from the get-go if you’re willing to take on the challenge.

Java: Java is an object-oriented and feature-heavy programming language that’s in high demand. Java is often used for Android and iOS app development, as it’s the basis of the Android operating system, which makes it one of the best choices if you want to build mobile apps.

Javascript: Javascript is another incredibly popular language. Many websites that you use every day rely on JavaScript including Twitter, Gmail, Spotify, Facebook, and Instagram. Additionally, it’s a must-have when adding interactivity to websites because it communicates with HTML and CSS. This makes it essential for front-end development and consumer-facing websites while becoming increasingly important in back-end development.

I believe that no matter what language you choose, you should not stop after your first language — the best programmers have a combination under their belt. After you learn one, the rest will likely be easier to pick up. Easier said than done! I think I'll struggle to learn more programming languages but they are worth trying!

0 notes

saastrac · 5 years ago

Text

Webflow Review – An Exceptional Website Builder| Forever FREE

Webflow is a website builder that has attracted a lot of attention. But how nice is it? For whom designed? How much this software costs? I am going to address all the above-mentioned questions, But, let’s start with the basics first –

Introduction

Most of the people refer to Webflow as an online toolkit for building websites. It’s a great combination between the classic content management platform and conventional website builders like WordPress. It is indeed one of those exceptionally SaaS platforms with the professedly specific target market.

Getting Confused?

This review post created to wave off that confusion. Considering the various components which Webflow offer including, CMS, Designer, eCommerce, Hosting, etc. you will also get answers to questions for anyone considering this platform.

The primary principle of WebSocial is so-called “smart codelessness”. Alternatively stated, it aims to provide a desirable balance between customization capabilities and code fewer processes of site-building. Also, you can monitor many of your website’s attributes without operating on the correct source.

Surprisingly, this platform does not lock you out of the cycle of coding. It still uses fun software to help you thoroughly customize your page, without actually confining yourself to any particular submission platform.

Are you feeling interested to know more?

Alright, hang around because this review post of the Webflow enables you to reach all the major components associated with this platform. Read out the essential features of Webflow, customer support, pricing, and the associated pros and cons.

Overview

Webflow moved ahead to the path of success with this mantra – “If you can imagine the ultimate outcome, you can bring it to life.”

This simple, yet versatile web-based drag and drop tool mainly developed with the principal focus on the designers and regular people. This tool will help them easily create responsive, flexible and powerful websites and applications better and faster without any special coding skills.

But that’s not all. The site builder was also systematically integrated with a CMS framework for seamless management of the entire ecosystem.

The platform is consistently integrated based on the framework of the Content Management System, which helps in seamlessly managing the entire ecosystem. They are also looking forward to capitalizing on some of the core functions, which include:

Ecommerce

CMS

Designing

Web Hosting

Interactions

Editing, etc.

Though this platform serves as an alternative to WordPress, it claims to be much simpler than this. As having said that, WordPress considered being one of the simplest and the best and simplest CMS platforms available on the internet today.

So, will Webflow able to take the challenge? Let’s check it out!

Salient Features

Inclusive Ease Of Use

One thing that could impress you right off the bat is the overall versatility or flexibility of Webflow.

For example, the website designer doesn’t come with the rigid site construction framework that is available in many other “user-friendly” options. In other words, you can choose any template of your choice here.

Although that considered to be an easy option as there are limited customization capabilities for pre-designed themes. But this website builder allows you to start with a completely blank canvas and build your site from the ground up.

Not only this, Webflow is designed to facilitate complete responsiveness and mobile-centric adaptability. Moreover, it also provides various designing features which include the tiniest website elements. Typography, which has numerous possibilities to accommodate, including Typekit, Google Font, and your own custom font.

Webflow, in particular, does not restrict you to its system. At any time, you can conveniently export Javascript, HTML, and CSS from your page to a third party website.

In case you are working on different projects simultaneously, then you should be able to arrange and control them directly from the dashboard display. With the project options, you can add them in folders, share, duplicate, and edit them. All the projects are available with a different set of array settings, which includes external service connections, SEO, code integrations, backups, websites, etc.

Though the only downside is the complex framework that is available with it. Newbies can find it a little difficult to try out the latest features of Webflow. However, it becomes easier and easier with more websites you work on.

These people also offer a complete set of useful video tutorials, which helps in providing valuable guidance in case you face any issues. But if that doesn’t turn out, you can always contact the customer support team, who I found to be quite responsive.

On the whole, people who are having the most manageable time using this platform are probably HTML and CSS coders. Similarly, on the other hand, non-coders are also most likely to gain great results just by footing well after a couple of hours on this platform.

Also Read : Why Choose Wix as a Free Website Builder | An Honest Wix Review?

WebFlow Hosting

The hosting function provided by this platform works on the policy – “Start building for free, add hosting to go live.” In simple terms, you are allowed to start creating your website on a free Webflow subdomain. You can then pay for one of the Webflow hosting packages to connect the website to a custom domain name.

One of the best plans to gain complete advantage of the hosting services is the basic plan. It allows us to provide hosting for some simple site with less than 500 form submissions and 25,000 monthly visits and at a minimum cost of $15 per month or $12 per month billed yearly.

Not only the custom domains, but there are also some extra features which are provided by this tool –

Free SSL certificate

CDN

Advanced SEO

Backups

Versioning

Some of the other benefits of leveraging Webflow hosting include:

Webflow hosting based on decentralized infrastructure operated by renowned cloud providers such as Amazon CloudFront and fastly.

Webflow hosting provides an additional CDN (Content Delivery Network) at zero additional cost. It accelerates the delivery of content to site visitors far from the position of your primary server.

Provides SSL compliance certificate for free to ensure that each site adheres to the current standards for web encrypted communications.

Webflow hosting based on more than 100 data centers spread across 6 continents, letting you choose a server that is nearest to your chief traffic source.

It provides a shorter loading page as compared to the standard HTTP websites.

Webflow Designer

The website builder and the design tool is given a fancy name as Webflow Designer, which provides a unique twist to the entire website creation process.

It provides a balance between the worlds of coding and non-coding. Users who do not have the advanced coding skills will take advantage of the intuitive DIY side of the website builder. Instead, on the other hand, experienced programmers, designers, and organizations will benefit from the complete freedom of choice that comes with the programming side of the Webflow site builder.

Therefore, you can consider it as a hybrid site builder. Apart from this, some of the specific features of this platform include:

Languages like JavaScript, HTML, and CSS coding easily handled by website-builder. Web developers expected to like the code creation features of their visual designer, which saves the trouble by line writing code.

The next thing which sets this Designer apart from others is its exceptional approach to editing the visual things. As here the canvas is designed to provide you with an easy to use way to tweak the elements of your page, with the versatility provided by HTML and CSS. For example, placing a square requires you to add a new “part” or “box” and then build a “set” location.

Well, Webflow Designer seems designed to serve professional web designers along with developers in the first place as well as their agencies.

Final Words

Webflow is one exceptional, high-end website builder for freelancers and designers. Several features like Databases, integrations, databases, several layout edit modes, identificators, integrations, template code export, etc. make it one of a kind platform.

The blended force of its Hosting, Designer, E-commerce offers, and Editor/CMS is massive. This website builder has also the most exquisite tailor-made website development setups. The 24*7 support team makes every single process smooth and easy.

In short,

Simplicity Level – (simple)

Progress in Learning – Mid (before you think to jump in and create something, you need to first watch the available videos and understand every terminology)

For Consumers (Perfectly suitable)

For Designers (Perfectly suitable)

For Developers (Perfectly suitable)

Time taken in the Development process (Quick)

Whitelabel – For businesses and agencies who carry out the payment.

In-built templates – Yes

Pricing Plans – Low

Your Thoughts?

I am thankful to you for taking the time from your busy schedule to read our analysis of Webflow. Was this review helpful? Do you have something to add, or do you disagree with some points? Let’s discuss in the comment section given below.

Originally Published On: SaasTrac

About The Author SaasTrac is one of the trusted places where users can find reviews on different Saas Products, Software, and Platforms. Our major goal is to let users know the detailed and the most helpful information possible about every product — the good, the bad, and the ugly in the SaaS space.

#high-end website builder #Webflow Review #Webflow #An Exceptional Website Builder #Exceptional Website Builder #Website Builder

0 notes

williamexchange · 5 years ago

Text

How to make a Website using HTML

HTML, or Hypertext Markup Language, is coding that forms the main building blocks of every website on the Internet. In the past, using HTML directly was far more common, but Content Management Systems (CMS) and WYSIWYG (What You See Is What You Get) interfaces that streamline the design process as well as developments in additional types of coding such as CSS, javascript, and JQuery have made websites far more aesthetic, functional, and easy to set up.

Despite these tools, however, knowing HTML is valuable when setting up a website because HTML forms the framework that a website bases all elements from. Therefore, even a basic understanding can provide valuable insight in what’s going on behind the scenes.

Webpages

Before delving into the coding itself, it’s essential to have a working knowledge of how HTML functions. Every page on a website can be thought of as a single HTML file. The HTML coding is like a language that speaks to a web browser. The browser translates the HTML files so that it can display them correctly.

HTML is static in nature, so without more advanced programming such as PHP, all of the information being displayed will have been manually coded by the individual in charge of maintaining the website. This means that automatic, dynamic content will need additional resources. However, it’s still easy to make a website using HTML and maintain it without advanced programming unless there are a large number of pages or a need to be constantly updating.

Like a browser, a person that’s creating the website will also need to learn the HTML language in order to get the page to display with the correct information and presented in the desired aesthetics in mind.

HTML Coding

The majority of HTML coding consists of opening and closing tags enclosing the text or information that it informs. Both the opening and closing elements are surrounded by the brackets usually used to designate greater than and less than in mathematical equations. The closing tag will differ from the opening tag with a forward slash before the element’s name (e.g. < h1 >This is a heading< /h1 >).

Commonly Used Tags

< html > – The website must begin with this tag. Without it, the browser will not be able to recognize the page as an HTML file. At the end of the file, the < /html > tag is used, designating all content that’s enclosed as the page’s content.

< head >< /head > – This composes the first major section of the content. Enclosed within should be the <title></title> tags that tell the browser what the name of the page is.

< body >< /body > – This is the other major section of the content. These HTML tags designate the bulk of the web page’s content and design elements such as text, tables, images, and links.

< h1 >< /h1 > – These tags designate any text enclosed within them to be formatted as the “Heading 1.” In short, this is the largest header text. Smaller headers can be defined with h2, h3, etc. with each getting progressively smaller. The h6 tag is the smallest defined heading.

< p >< /p > – These tags designate a single paragraph that should be displayed on a single line with word wrap, of course.

< a >< /a > – These tags will add a link to the page. The destination will be designated in the opening tag, and the anchor text (what is displayed) will be enclosed between the opening and closing tags like so:

< a href=” destination location “>This is the display text< /a >

< strong >< /strong > – This formats text as bold.

< em >< /em > – This formats text as italic.

Some HTML coding does not need a closing tag because all elements are defined within the single opening tag. Perhaps the most used instance of this is when HTML coding is used to display an image. The coding for this goes as follows:

< img src=” location of the picture” />

Other elements such as size, alignment, hover text, and border can also be defined within the tag, and a closing is not needed because the source of the image must be included in the tag itself rather than enclosed between two tags.

There is a multitude of other HTML elements that can be learned, so if it’s necessary to learn more, visit other online HTML reference sites for more information.

Example of HTML in Action

< html > < head > < title >This is the title< /title > < /head >

< body >

< h1 >This is Heading 1< /h1 > < p >This is the < em >first< /em > paragraph.< /p >

< p >This is the < strong >second< /strong > paragraph, and < a href=”www.google.com”>here< /a > is a link to Google.< /p >

< img src=”image.jpg” alt=”This is hover text” width=400 height=400 />

< p >This is the third paragraph.< /p >

< /body > < /html >

The above coding could be copied into a notepad document and saved as a .html file. When you open the file in the browser, the HTML would actually trigger and display like an actual website.

Jazzing Things Up

CSS (Cascading Style Sheets) can be used to define the way specific HTML elements function and is particularly helpful in mastering the layout of the page. Some of the most common functions include designating the default font on the page, choosing to how a drop-down menu operates, and getting pictures to change when the cursor hovers over them.

Javascript and JQuery both help with the aesthetics and functionality of a page by adding movement and options to attract a user’s attention. From picture galleries and image slideshows to moving text and pop-up boxes, the options are endless.

Make a Website Using HTML

HTML is a coding language, and learning a language is difficult. Unlike other languages, however, HTML can be troubleshooted through various means, and there are numerous online resources that can help someone do so. Using HTML doesn’t have to be difficult, and it can even be fun.

Even though sites do not typically just use HTML anymore, this type of coding still informs the way all websites are set up.

Other coding languages simply influence the way HTML behaves and displays, and there are many interfaces, systems, apps, and tools that facilitate the coding process. Nonetheless, having a basic grasp of how HTML functions can be invaluable when both designing a site from scratch and while utilizing additional resources.

Advanced Digital Media Services, a reputable Web Designers in St Petersburg, FL , offers web design services that are proven to be effective in branding and marketing. We can alter and customize our packages to maximize the potential of your campaigns.

0 notes

mentalmars · 5 years ago

Photo

Past, Present, and Future of the ECHOcast - Borderlands 3 Interview

Who are you and what do you do? Hey there, my name is Scott Velasquez and I’m a programmer by trade. Most recently I was a lead programmer on Borderlands 2, Battleborn and then the Online and Social Product Owner for Borderlands 3. I will have been at Gearbox 19 years this August! How did you get started in the industry? Just after graduating with a Bachelor of Science from UAT in 2000, I landed a job at Cinematix Studios in Tempe, AZ. It was here where I finally earned the right to call myself a professional game developer working on two PS2 titles (Hirelings and Renegade Zero). I was responsible for the audio and input systems as well as the 3rd person camera systems. I was so excited working on the camera systems I had to call my college Calculus teacher and tell him I was applying the things he taught us, ha! Previously, I was big into modding Half-life, Quake and Duke Nukem 3D as well as working on my own personal projects. A friend and I wrote a Java 3D engine named Loco3D the moment 3D was added to Java. Our test data consisted of 3D models like Tie Fighters, buildings and etc. that we hand-built in a text file! Another friend and I wrote a C++ multiplayer checkers game which where we learned a lot about OpenGL and network programming at the Winsock level. In my spare time while at Cinematix I built a C++ game engine whose biggest feature at the time was being able to switch between Direct3D and OpenGL at run-time (something quite common to attempt at the time). I made my way to Gearbox after Cinematix failed to land a publisher for either PS2 game and had to close up shop. It’s been a great ride so far! I saw that you are the social product owner of Borderlands 3, what does that mean? Product Owner is a term typically associated with Agile development in a typical software company. I believe this is the first time we’ve used this role at Gearbox, but the intent was to capture the role of a person who could design and direct a group of developers to build new online and social features for BL3. I’m a generalist and customer-focused at heart so this ended up being a great fit in my mind. On any given day I could switch between the following roles: Programmer Designer Project Manager Business Strategy Customer Advocate Consumer of the Coffee Beans We drove the implementation of a number of features you are probably familiar with such as: Photo Mode Player Pinging Vault Hunter Profile on Roster UI Ask for Help Rare spawn sharing Dueling Lost loot Mail system Takedowns Twitch ECHOcast What was the inspiration for making the twitch extension? For years I was bothered watching Twitch hoping the streamer would open their scoreboard so I could see their stats in the competitive title they were streaming. Twitch visited us during Battleborn/early BL3 development and I urged them to consider building a product that allowed us to build interactions into the game to improve the quality of life for viewers and streamers. They must have heard this from other developers too as they officially announced extensions in 2017. Nobody outside of Gearbox/2K knows this, but I had actually created my Twitch developer account in 2013. We had a vision for Battleborn that included many things had the game taken off. One of which was integrated Twitch streaming and an extension. My Twitch developer account and grand ideas laid dormant until I got the nod from our Creative Director of BL3 to move forward. I asked around both the Frisco and Quebec studios to see if anybody had Twitch experience and got hooked up with my main man Michael Dube! As people joined the ECHOcast team they all offered ideas and feedback to help shape it was it is today. The objectives for the extension were to: Improve quality of life for streamers and viewers No more asking the streamer to show you their “gear/build/stats” Provide ways for streamer to foster their community and viewers a way to interact with their favorite streamer Raise the bar for video games streamed on Twitch Deliver new innovative and integrated experiences Partner with Twitch and streamers early Amplify BL3 milestones and reach new customers Earn loot before the game ships On-stream pre-order/purchase and continued updates alongside DLC and patches How does the extension “basically” work, how much planning and programming goes into it, does the game get shaped around these features or do you need to work within the parameters of the game itself? Great question. On the surface, it seems really straightforward, right? It is, but it isn’t! The extension is essentially a web app running on top of the Twitch video player. The game communicates with Twitch and our backend service running in the cloud to send data and events to the extension. The extension communicates with Twitch and our backend service when taking part in an event or linking your SHiFT account. You’re talking about three distinct areas of work consisting of three different languages (C++, Go, Javascript/HTML/CSS) and product deployments! All the while keeping into account that the game needs to run as if no extra work was added, the backend service has to handle Twitch scale and do so cost-effectively and the extension has to work on a variety of browsers and resolutions. Oh by the way, did you know that the ECHOcast extension actually runs on a Tesla? How freakin cool is that?! A lot of planning and programming went into developing the ECHOcast. We were really blazing trails for us at Gearbox and learned quite a lot along the way! We partnered with Twitch and a handful of streamers early so we could really good grasp on the technical challenges and what streamers thought about our designs. The ECHOcast was a huge team effort! For the initial release, no the game didn’t get shaped around ECHOcast. One reason was that it was unproven, but more importantly, it’s because we wanted the work put into ECHOcast to be able to happen anywhere in your Borderlands 3 adventure. In other words, we didn’t want a feature to only become available in a certain location otherwise the chances of us making an impact would have dropped tremendously. After the game launched and ECHOcast was out in the wild, people around the studio really started to take notice and they started stopping by talking to us about upcoming things where ECHOcast could be integrated. We have more big updates planned! I heard that my friend, lowlines, is helping out with the twitch extension. How did the team get established? He sure is helping! He was actually the first person I reached out to when I got the go-ahead to develop ECHOcast. We met through his Borderlands and Battleborn projects where he developed all kinds of cool stuff for the community. I’d like to think we’re pretty good friends at this point! Version 1 of the twitch extension was launched at the Borderlands 3 reveal event, how exciting was that and what did you learn from the process? First of all, it was great to finally meet you in person at the event! But man, as if revealing the game wasn’t enough we were like “let’s ship version 1 of ECHOcast and allow up to 200 streamers to stream it live AND earn rare chest loot!” That’s my kind of ambition! haha It was very exciting and very humbling to the team who almost all made it out to Los Angeles to witness first hand. The game and ECHOcast were received very well and our first trial run at scale was successful. We gathered a lot of feedback and telemetry from the reveal that allowed us to optimize the rare chest event and apply the lessons forward to the game’s release which included pinata and the badass event. Since the launch of the extension, you guys kept working on it. Version 2 added mobile compatible. What can we expect in the near future? (V3) There are some really cool and fun updates coming along and we’ll be talking about those very soon! Tune in to the next Borderlands Show on February 11 to learn more! You work with Rick, the owner of DIM, an item management tool for Destiny. Now that Borderlands 3’s inventory space has increased significantly, do think it’s possible to see an online item management tool? That’s right, Rick brought his expertise to help ECHOcast development as well. I would love to leverage more of Rick’s experience, but nothing to officially comment on at the moment. I think it is safe to say that we would like to continue pushing forward though! Like Lowlines, I think we all made a new friend in Rick as well. Thanks for the recommendation, Lowlines! I personally had a few ideas for the twitch extension: While ‘fight for your life’ mode is probably too short to interact with the community. But what if a streamer goes down a bunch of times and the community can help him/her get through it by providing a buff, like extended FFYL, health boosters, or shield boosters. I think this could also give the viewer a sense of accomplishment as they helped their favorite streamer achieving a tough goal. Ha, great minds think alike! It’s funny you should mention this was actually in our initial prototype by Mick aka Michael Dube, one of the badass game programmers helping with ECHOcast in our Quebec City studio. The ECHOcast team is world-wide! I wish I could tell you more but you’ll just have to wait and find out 😊 Would a Community Slaughter Fest work? When the streamer enters a dome, the viewers can decide which type of enemies each wave has. Streamer VS Viewers. Another great idea, we’re all on the same wavelength I think! We pitched this and I definitely think this could work. Given the schedule the game teams are working under it wasn’t something we could add in time and make sure not to break across the game. Definitely something I think we should keep in our back pocket for the future! Is there anything my readers should know that I haven’t asked you? Let’s see…well they probably already know how badass you are, so I don’t think that needs to be said I would just like to say thank you to everybody who purchased Borderlands 3 and checked out ECHOcast. We’re always open to feedback on anything we had a hand in so please feel free to tweet at me or whatever. Twitch just added a way for streamers to provide feedback about an extension so please consider using that for feedback too! PS. Send tacos, all the tacos! Do you have any advice for the folks that wanna get into the games industry? You bet! The very first step, before buying books, paying for an online course or signing up for college… Make sure you understand the high level of what it takes to make a video game. Specifically, what roles are responsible for what in the game and what skills are involved. Then think about what you’re passionate about when you take into consideration the roles learned above. Also, think about where you naturally excel…good with math? Art? etc. Once you narrow down the role you can begin to learn and practice. Build up a portfolio and record notes on what you learned and are most proud of with each personal project. Hack and build mods on existing games that offer SDKs or user-generated content. When you get to the point of interviewing, be yourself and allow your passion, experience, and ability to learn and work with others show. Don’t forget to ask your potential employer lots of questions too, you should be interviewing them as well! Good luck, I’ll be playing your games before you know it!

Continue reading on https://mentalmars.com/game-news/past-present-and-future-of-the-echocast-borderlands-3-interview/

#Borderlands 3 Interview #Borderlands 3 News

0 notes

mbaljeetsingh · 5 years ago

Text

How to build and deploy your own personal portfolio site

Hello! My name is Kevin Powell. I love to teach people how to build the web and how to make it look good while they’re at it.

I’m excited to announce that I’ve just launched a free course that teaches you to create your very own fully responsive portfolio website.

After you’ve finished this course you will have a neat-looking portfolio site that will help you land job interviews and freelance gigs. It’s also a cool thing to show to your friends and family.

We’re going to build the portfolio using Scrimba’s interactive code-learning platform, and then deploy it using DigitalOcean’s cloud services.

Also, DigitalOcean has been generous to give everyone who enrolls a free credit, so it won’t cost you anything to get it up and running.

This post is a breakdown of the course itself, giving you an idea of what's included in all the lessons. If you like what you see, make sure to check it out over on Scrimba!

Lesson 1: Introduction

In the first lesson, you’ll get an overview of the course so that you know what to expect, what you should know before taking it, and what you’ll end up with once you're finished. I also give you a quick intro to myself.

Lesson 2: Setting things up - HTML

In part two, I’m going to show you around in the Scrimba environment and we’ll also set up the project.

All the images are supplied, so you won’t need to worry about looking for the perfect photo just yet. We can focus on building the portfolio!

Don’t forget that you can access everything you need from text and colors to fonts and much more at our dedicated design page.

Lesson 3: The header area - HTML

It’s finally time to start building out the portfolio. In this lecture, we will create the header section. We will brush up on the BEM methodology for setting class names in CSS, and I think you’ll find that this makes the navigation simple and straightforward to create.

Lesson 4: Intro section

Next up is the Intro section of the portfolio. This is where we will introduce ourselves and put a picture of ourselves.

In the end, we add a section about the main skills/services we can do. For the moment we can just fill it all in with “Lorem ipsum” text as a placeholder, until you're ready to fill it in with your own text.

In this chapter, we’re finishing off the rest of our HTML with the last 3 sections: About me, where we’re going to introduce ourselves in greater detail; Work, where we’re going to add some of our portfolio examples, and our footer.

Footers are ideal for linking to email addresses and I will show you how to do that with an <a> tag. We can also add our social media links there too.

For now, it all looks a bit raw and all the CSS fun is ahead of us.

Lesson 6: Setting up the custom properties and general styles

Alright, time to get make that page look amazing!

In this part, we’re going to learn how to add custom properties.

While setting up CSS variables can take some time, it really pays off as the site comes together. They're also perfect for allowing you to customize the site's colors and fonts in just a few seconds, which I take a look at how to do once we wrap up the site.

Lesson 7: Styling the titles and subtitles

Having set all the needed typography, I will walk you through the subtitles of designing and styling the titles and subtitles in our sections.

Lesson 8: Setting up the intro section

Over the next few chapters it’s going to be quite hands-on, so no worries if you feel like rewatching the screencasts a couple of times.

We're keeping everything responsive, using CSS Grid and taking a little dive into using em units as well.

This is the perfect example where CSS Grid shines through and we’re going to learn how to use properties like grid-column-gap, grid-template-areas and grid-template-columns.

Lesson 9: Styling the services section

To add a little bit of interest, I look at how we can add a background-image to this section of the site. It's a nice way to break up the second and avoid just having solid color backgrounds everywhere, and I also look at how you could use background-blend-mode to change the color of the image to help keep the look of your site consistent.

As a bonus, we’re also going to learn how to style out buttons when they are hovered over or selected when we tab through the page.

Lesson 10: The About me section

Great progress! So this is the all-important About me section. This one is pretty similar to the Intro because we’re going to use CSS Grid, but move the picture to the right side and find a useful example for CSS fr unit.

Lesson 11: The portfolio

In this screencast, I will show how to build our portfolio section to display some of our great work. And we’re even going to learn how to use cubic-bezier() to a great and impressive effect with some hover styling!

Lesson 12: Adding the social icons with Font Awesome

This cast will be sweet and short, so you can rest a bit and learn some quick tips and tricks.

Adding social media links with Font Awesome icons is a breeze. We can do it with an <i> tag and then adding a class name of an icon you wish to add.

As an example, here’s how to add an icon for GitHub once you have Font Awesome linked in your markup.

While the icons are in place, we do need at add more styling here to get them to be set up the way we need them to be.

With a little use of flexbox and removing the styling from the list with list-style: none it's relatively straight forward.

Lesson 14: Setting up the navigation styles

We have left the navigation to the last because very often it’s one of those simple things that can take the longest to set up and do correctly.

Once completed, the navigation will be off-screen, but slide in when a user clicks on the hamburger icon. The first step though, is to get it styled the way we want it to look, then we can worry about actually making it work!

Lesson 14: Creating the hamburger

In this screencast, you’ll learn how to add a hamburger menu to transition to the navigation view. It’s not an icon or an svg, but pure CSS.

We’re going to have a chance practice ::before and ::after pseudo-selectors, transition, and, since it's not a link but a button, we also need to define the different cursor when we hover over the hamburger icon to indicate that it can be clicked with cursor: pointer.

Lesson 15: Adding the JS

With a little bit of JavaScript, I will walk you through the implementation of a really nice and smooth transition from our main screen to the navigation window on click of the hamburger menu.

I also take a look at how we can add in smooth-scrolling with CSS only by using scroll-behavior: smooth. Yes, it really is that simple! It also makes a great tweet for Today I Learned (TIL). Feel free to send you TILs to @scrimba and I’m sure they will be really happy to retweet them!

Lesson 16: Creating the portfolio item page

With the homepage wrapped up, it's time to work on a template portfolio page that can be used to give more details on each of the projects that you are putting in your portfolio.

We're also going to learn how to link it seamlessly with our main page for a nice user experience.

Lesson 17: Customizing your page

This is where the magic of CSS custom properties comes in!

In this video I look at how we can customize the custom properties that we set up to change the color scheme of your site within seconds, and how we can update the fonts quickly and easily as well in order to make the site your own!

Lesson 18: DigitalOcean Droplets - What they are and how to set one up

In this screencast, we're going to explore DigitalOcean droplets. They are Linux-based virtual machines and that each droplet is a new server you can use.

It can seem daunting, but they are super easy to set up, very customizable and come with a lot of useful features, like a firewall automatically.

I'll talk you through every single step of the way so that you know exactly how to set a droplet up.

Lesson 19: DigitalOcean Droplets - Uploading files via FTP

To finish the whole process off, let me show you how we can upload our portfolio to the droplet we've created in the previous chapter and now it's online for others to see!

Lesson 20: Wrap up

And that's it! Your next step can be to make this page all about you, add all the relevant examples, tell us about you and make it live in a DigitalOcean droplet.

Once you've put yours together and got it online, please share your portfolio with Me and the team at Scrimba! You can find us at @KevinJPowell and @scrimba on Twitter, and we would be really happy to share what you're up to!

Check out the full course

Remember, this course is completely free. Head on over to Scrimba now and you can follow along with it and build out a fantastic looking site!

via freeCodeCamp.org https://ift.tt/2QwcP6z

#IFTTT #Feedly

0 notes

mentalhealth-dy · 5 years ago

Text

Web design

As this is my first time properly designing a website, I thought it would be important to have a look into what I should know when designing a website.

I did some research and found a really helpful website that gave me some tips to consider :

(I know this is a lot to read but it is just something I wanted to add to my blog so that I can keep going back to it)

Optimize Web Graphics for Better Page Load Times

Learn how to optimize your web graphics by selecting the proper format and making sure that it’s as small as it can possibly be. Even though people are advancing to broadband connections, there are still quite a few who use dial-up internet connections. Additionally, with the emergence of mobile device technologies that don’t necessarily have broadband-like speeds, having slow page load times due to image file sizes can turn users off.

Here a general rule of thumbs for picking the right file format: images that have solid colors are best saved as PNGs and GIFs, while images with continuous colors (such as photographs) are best saved as JPGs.

There are plenty of tools available at your disposal that will help you further optimize your images and lower their file sizes, check out this list of tools for optimizing your images.

By limiting the number of images you use to the bare minimum, being smart about using images, and reducing file sizes as best as you can, you will significantly cut down page response times of a web page and improve your web page performance.

Keep it Clean and Simple

A good web design is not just one that looks visually appealing, but also one that is user-friendly. A clean and simple web design typically ends up being a high-usability web design that is not confusing to interact with.

By having too many site features and components on a page, you risk the chance of distracting website viewers from the purpose of the website. Make sure each page element has a purpose and ask yourself the following questions:

Does the design really need this?

What does this element do and how does it help the user?

If I remove this element all of a sudden, will most people want it back?

How does this element tie into the goal, message, and purpose of the site?

Additionally, though it may be super awesome to come up with a new concept or interface design pattern for your website, make sure that the design is still accessible and intuitive to your users. People are accustomed to common interaction patterns, site features, and web interfaces – and if your design is truly unique, make sure it’s not too obscure and puzzling. Be creative, but also keep it simple.

Navigation is the Most Important Thing You Will Design

The most essential site feature is the website’s navigation — without it, users are stuck whatever page they happen to land on. With that obvious fact out of the way, we’ll talk about some important points to consider when constructing a navigation scheme.

First, it’s very important to put enough time and a lot of planning on a site’s navigation structure. This is common sense, but it’s still surprising how many web designs take site navigation for granted.

Placement, style, technology (will it use JavaScript or just CSS?), usability, and web accessibility are just some of the things you need to consider when creating the navigation design.

Your navigation design should work without CSS because of text-based browsers. Poke fun of text browsers all you want, but they are still prevalent in many mobile devices. Perhaps more importantly, navigation that works with CSS disabled is accessible (99.99% of the time) via screen readers.

Navigation should be accessible and usable without the need for client-side technologies such as JavaScript or Flash, which users may not have enabled or installed for various reasons such as security or company policy.

It is imperative that you have a good navigation system in place that is located at a highly-visible location. A good navigation is detectable as soon as the web page loads without having to scroll down the web page. This is where keeping it clean and simple plays a major role: a complex and unconventional design can lead to user confusion.

Users must never wonder, even for a split second, “Where is the site navigation?”

For sites organized in a hierarchical, multi-level manner, make sure that it is easy to navigate from between parent and child web pages. In addition, it should be easy to reach top-level pages (such as the site’s front page) from any webpage.

The main goal of your site navigation is to allow users to get to their desired content with as few actions and with as little effort on their behalf as possible.

Use Fonts Wisely and Methodically

Though there are thousands of fonts out there, you can really only use a handful (at least until CSS3 is fully supported by major browsers). Make it a point to stick to web-safe fonts. If you don’t like web-safe fonts, consider a progressively-enhanced web design that leverages sIFR or Cufon.

Keep font usage consistent. Make sure that headings are visually-different from paragraph text. Use white space, tweak line-height, font-size, and letter-spacing properties to make content pleasant to read and effortlessly scannable.

Perhaps one of the things that web designers often get wrong is font-sizes. Because we want to fit as much text as we can in a web page, we sometimes set font sizes to uncomfortably small sizes. Try to keep font sizes at and above 12px if possible, especially for paragraph text. While many people face no difficulty reading small text sizes, think about older users and persons with low-vision and other types of vision impairment.

Understand Color Accessibility

After talking about fonts, we also need to point out the importance of using the right colors.

You need to consider color contrast of background and foreground colors for readability and for users with low-vision. For instance, black text on white background has a high-contrast, while orange text on red background will make you strain your eyes.

Also, use colors that are accessible to users with particular forms of color-blindness (check out a tool called Vischeck that will help you test for certain types of color-blindness).

Some color combinations work well only when the color is used as a foreground color instead of a background color. Take for example, dark blue text on a pink background versus but pink text on blue background, same colors but different levels of readability and reading comfort. It is important not only to get a good color combination but also to apply it to the right elements on the page.

You Need to Know How to Write Code Yourself

With various WYSIWYG editors flooding the market, it has become as simple as 1-2-3 to design a site. However, most of these editors insert unnecessarily code junk, making your HTML structure poorly designed, harder to maintain and update, and causing your file sizes to bloat.

By writing the code yourself, you come out with clean, crisp, and terse code that’s a pleasure to read and maintain; code that you can be proud to call your own.

Knowing how to use a WYSIWYG or an IDE with a visual preview does not excuse you from learning HTML and CSS. You have to know what’s going on in order to create effective, semantic, and highly-optimized web designs.

Don’t Forget Search Engine Optimization

A good designer should always remember to keep the basics of SEO in mind when designing a site. For example, structuring web content so that important text are represented as headings (i.e. page title and logo). This is where learning how to code properly comes in handy. Knowing correct, semantic, and standards-based HTML/CSS – you will quickly realize that divs are better than tables for web layouts not only for accurate representation of site content, but also for search engine rankings; you will also know that CSS background text image replacement is a good idea.

Understand that People are Impatient

People on an average spend only a few seconds before deciding whether they want to read more or navigate away to another site. Therefore, you as a web designer have to device a way for encouraging users to choose the former option within those precious seconds.

Know that not many visitors will scroll down to view the entire contents of the page if what they see at the top does not interest them. Remember to keep your important elements on the top where they are easily visible, but also do not overcrowd the top half of the page which can intimidate users and turn them off from reading further down the page. Consider the top half of a web design a selling point: be a salesman, make people buy into the notion that they want to see what else is on your site.

Learn About (and Be Aware of) Browser Quirks

One of the things you must know as a web designer is that your work operates in a finicky and unpredictable environment: web browsers. It’s not enough that your designs work on a few web browsers, they need to work in as many browsing situations as you can possibly afford. Before production – test your prototypes using tools like Browsershots.

Make Designs that are Flexible and Maintainable

A good web designer makes sure that the site can easily be updated or modified in the future. Designing websites that are malleable and easy to maintain is a sign of a great web designer. Make your work as modular as possible by separating style from structure.

Know that our industry is dynamic and still young – things change in a very short amount of time. Keeping this thought in mind will promote the creation of flexible web designs.

0 notes

tak4hir0 · 6 years ago

Link

Rules Package size below 13 kB All your code and game assets should be smaller than or equal to 13 kilobytes (that's exactly 13,312 bytes, because of 13 x 1024) when zipped. Your .zip package should contain index.html file in the top level folder structure (not a subfolder) and when unzipped should work in the browser. Don't overcomplicate building the zip package, it should unpack on any platform without problems. You can use tools that minify JavaScript source code. Two sources - readable and compressed The competition is focusing on the package size, but learning from others is also very important. Please provide two sources of your game - first one should be minified and zipped to fit in the 13 kB limit (sent via the form) and the second one should be in a readable form with descriptive variable names and comments (hosted on GitHub). No external libraries or services You can't use any libraries, images or data files hosted on server or services that provide any type of data - for example Google Fonts are not permitted (although you are allowed to ask users to live-load a web font to support some characters or emoji on devices that can't display them properly, but you have to make sure your game will work without them). Analytics and other stat-collecting scripts are also not allowed. Your game should work offline (Desktop and Mobile categories) and all the game assets should fit in the package size limit (not counting WebXR's A-Frame, Babylon.js, and Three.js frameworks). If you manage to shrink your favorite library below 13 kilobytes including the code itself, then you can use whatever you want, just remember about the 13 kB limit. Main theme Main theme for the competition is back. It's highly advised to follow it in your game, because the judges will pay attention to that, but you can freely interpret the theme and implement it however you feel would be the best. Deadline - 13th September 2019 The competition starts at 13:00 CEST, 13th August 2019 and ends at 13:00 CEST, 13th September 2019. No submissions will be accepted after the end of the competition, although there may be exceptions to that. Licensing You have to have the rights for every asset used in your game. Remember that the submitted games will be published and made available for everybody to see. On the other hand, you have the right to report any game publisher that will link to (or iframe) your entry on their portal without your permission. New content only Do not submit any old games or demos - you have a whole month to work on something new and fresh, this should be more than enough. Also, submitting Breakout or Flappy Bird clones taken out of a tutorial make no sense at all - try creating something at least a little bit more original. Errors and browser support Your game must work and be playable in at least two browsers: latest Firefox and Chrome, but the more supported browsers, the better. There should be no errors - you can lose some points if your game is showing any errors in the console. If we cannot play your game, it won't be accepted. Teams It doesn't matter if you're working alone or with your friends, just remember that the number of prizes is fixed, so you'll have to share your trophies with your teammates. Sending submissions There's a special form to submit your game. Please remember that you have to provide two sources (see the Rule #2 for details) - a link to a public repository on Github and a zipped package. Participants are allowed to submit more than one game in the competition, though sending the same game as independent submissions targeting different platforms (for example separate builds for desktop and mobile) is forbidden. Accepting submissions Submissions will be checked manually and published after positive verification. This may take up to a couple of days, so be patient if your game is not yet online. I claim the right to reject any submission without giving a reason, although I hope I don't have to. I also have the right to update the rules of the competition at any time. Time frames for voting, giving feedback, and announcing winners The voting among the participants will last for three weeks between September 16th and October 4th, winners will be announced on October 5th. Experts will give the games constructive feedback (one per game) during the same three week period - their comments will also be published on October 5th. Save data ⁄ persistent memory Remember to add prefix to your variables and create a namespace for your game when you save data to localStorage as all the games on the server share the same memory when played in the browser. Also, be sure to NOT use localStorage.clear() as it will wipe out all the data of all the other games. Manipulate the data you are sure is yours. Server category specific rules All the Server category rules, the sandbox server and the demo code can be found at github.com/js13kGames/js13kserver. Code of conduct All participants and judges at js13kGames are required to agree with the following code of conduct. Organizers will enforce this code throughout the online event. We are expecting cooperation from all participants to help ensuring a safe environment for everybody. Js13kGames is dedicated to providing a harassment-free competition experience for everyone, regardless of gender, sexual orientation, disability, physical appearance, body size, race, or religion. We do not tolerate harassment of competition participants in any form. Competition participants violating these rules may be sanctioned or expelled from the competition at the discretion of the competition organizers. TL;DR: Be excellent to each other. For more details see Berlin Code of Conduct. Privacy policy By entering your email address and sending a game through the submit form you agree to receive email communication about important events of the competition like announcing the winners or sending out the digital prizes, but also curated content from the partners about their tools, services, or job offers. I will never share your email with anyone though. Frequently Asked Questions Why exactly 13 kB? Well... why not? :) What's in it for you? Are you getting paid? Nope, it's just my own idea and it's made for pure fun. I'd love to get a sponsorship though as I spent my own private money on the first edition to cover making t-shirts, shipping of the prizes worldwide, etc. What does the "zipped" term exactly mean? Sent package should be zipped with your usual system archiver, the only allowed extension is .zip. Let's keep it simple - it's a competition for coders and this should be your main focus, the code itself. Thanks to the zipped archive you will easily send your game and we will easily check the file size. Can I use Flash? No, you can code your game using only the open web technologies like JavaScript, HTML and CSS. Can I use WebGL? Yes, though it might be hard to fit it into 13 kilobytes if you plan on doing an FPS game. Can I use CoffeeScript or TypeScript? Yes, you can use it, but you can't submit it. Only JavaScript code will be accepted, so remember to have your compiled code within the 13 kB limit. This is to ensure that the submitted entries are an actual HTML page with scripts, not a binary. Can I use WebAssembly and ⁄ or Rust? Yes, after all those are web technologies, and can work well with JavaScript games if used properly. Can I use compression through the self-extracting PNGs? You can use it, but remember that the zip is as good, or even better in terms of compression than PNGs, so there's no point in doing so. Do I have to register somewhere? No, you just need to submit your game through a form when it's ready. How many games can I submit? As many as you want, there are no limitations. More questions? Send them in via email or social media or post them in the dedicated topic at the HTML5GameDevs forums.

0 notes

t-baba · 5 years ago

Photo

The importance of establishing code guidelines and standards for a project

#430 — March 4, 2020

Read on the Web

Frontend Focus

Why The GOV.UK Design System Team Changed The Input Type for Numbers — Highlights how the <input type="number"> element can be somewhat problematic in some scenarios, and offers up a solution.

Hanna Laakso

Safari to Snub New Security Certs Valid for More Than 13 Months — From September 1, any new certificate valid for more than 398 days will be rejected by Apple’s Safari browser. While this is a Safari only move for now, if this catches on it might affect how you manage your TLS certificates.

The Register

AWS Webinar: How to Scale Kubernetes in AWS — Operating a Kubernetes environment at scale requires monitoring for performance and health. Join this webinar to discover how to proactively approach monitoring of your Kubernetes environments — at any scale and any level of complexity.

Amazon Web Services (AWS) sponsor

Rolling Code Standards — Covers the significance of establishing code guidelines and standards at the beginning of a project, and the importance of evolving those standards as a project progresses.

Brad Frost

The CSS Working Group Publishes Four 'First Public Working Drafts' — This update briefly discusses the first drafts for four specs: CSS Color Module Level 5, Media Queries 5, CSS Transforms Level 2, and CSS Conditional Rules Level 4.

W3C

Brave Browser Now Automatically Points to Wayback Machine On 404 — The web browser can now detect when a webpage is unavailable and will offer to search the Wayback Machine for a backup. The feature isn’t just for 404 errors though, as it will also trigger when hitting a 408, 410, 451, 500, 502, 503, 504, 509, 520, 521, 523, 524, 525, or 526 error.

Jon Porter

Stop Using ‘Drop-Down’ — This is a little opinionated because there does seem to be a place for the term, but getting the terminology right in the 11 instances discussed is important.

Adrian Roselli

💻 Jobs

Frontend Developer at X-Team (Remote) — Work with the world's leading brands, from anywhere. Travel the world while being part of the most energizing community of developers.

X-Team

Find a Dev Job Through Vettery — Vettery is completely free for job seekers. Make a profile, name your salary, and connect with hiring managers from top employers.

Vettery

📙 News, Tutorials & Opinion

Ten Ways to Hide Elements in CSS — Each of the 10 methods has an accompanying chart that looks at various pros/cons including accessibility, browser support, layout/reflow, performance, and more.

Craig Buckler

Currying in CSS? — The concept here is based on the fact that the values of CSS custom properties aren’t evaluated until they’re used. This kinda sorta resembles ‘currying’ in JS.

Trys Mudford

HTML: The Inaccessible Parts — Dave has created a “living document” (that he intends to keep updated) that references different problems various sources have found with the accessibility of certain HTML elements.

Dave Rupert

How to Build Forms With React the Easy Way — Building forms with React can be frustrating. TJ VanToll suggests one way to tackle this challenge with ease. Read more.

Progress KendoReact sponsor

What Frontend Engineers Should Know About Backend — Subjects discussed include request rates, down time, HTTP status codes, delegating business logic, CORS, and cache busting.

Alexander Wang

Negative Margins in CSS — As the author points out, this might be the only article that covers negative margins in-depth (though it doesn’t go into flexbox and grid).

PETER-PAUL KOCH

How to Use requestAnimationFrame() with Vanilla JS — If you’ve never really had a use for this feature, but want to know how it works, this is easy to follow with some simple demos.

Chris Ferdinandi

The Mindset of Component Composition in Vue — A step-by-step tutorial building a search bar component. Good for those already familiar with Vue but maybe want to see another developer’s perspective on component composition.

Marina Mosti

Build a Single Page Application (SPA) Site With Vanilla.js

Jeremy Likness

🗓 Upcoming Events

FrontCon, April 1-3 — Riga, Latvia — A two-day conference that focuses on front-end concepts and technologies. This year, there will be 23 speakers, 300+ attendees, and four workshops.

ImageCon, April 22-23 — San Francisco, USA — Learn the latest in innovative approaches to the visual web.

You Gotta Love Frontend Conference, May 14-15 — Vilnius, Lithuania — Described as having "big names with irresistible talks and a whole lot of fun". The CFP is now open.

🔧 Code, Tools and Resources

Shadows: A Box Shadow Generator — This nifty browser-based tool can create smooth looking layered box-shadows. There is also an accompanying Figma plugin.

Philipp Brumm

Heroicons: Free MIT-Licensed High Quality SVG Icons for UI Development — 140 icons in total, available in solid or outline style.

refactoring ui

css.gg: Over 500 Customizable CSS Icons — Another icon set, this time a collection of retina-ready icons built in CSS.

Astrit Malsija

Customizable Checkout Experiences Made Easy. Build with Square

Square sponsor

Google Lighthouse Firefox Add-On — The mega-popular performance and website quality tool is now available as a Firefox extension.

Mozilla

Pep: Turn Your Website Into a Fast, Installable PWA Instantly — Ostensibly can be done using a single line of code. Free for sites up to 10k page views per month and there are paid plans after that.

pep.dev

Panolens.js: A JavaScript Panorama Viewer Based on Three.js — View examples here. This is a lightweight, flexible, WebGL-based panorama viewer built on top of Three.js.

Ray Chen

Web Font of the Week

Shake

There's a deeply personal story behind this font initiative, and although finding a practical use for it may prove tricky, it has been created to raise awareness and fund Parkinson's research.

by via Frontend Focus https://ift.tt/2uXsZy6

#HTML5 Branding #HTML5 Weekly

0 notes